当前位置: 首页 > Web前端 > vue.js

如何快速上手angular.js

时间:2023-03-31 16:55:57 vue.js

摘要:准确的说,angular.js不应该是一个框架,而是一个js库,是对jQuery的进一步封装,去掉繁琐的DOM操作,使用数据驱动MVC模块化库。嘿,这很难。连续遇到两个大坑。我以前没有写过angular。我认为angular与vue和react是同一个框架。没想到angular.js和angular2没有关系,我深信。原来是一件古老的古董。只能退一步想想,先打基础,后面再深入框架原理。还是按照三个步骤:what:什么是angular.jswhy:为什么用angular.jshow:如何使用angular.jswhatisangular.jsangular.js准确的说应该不是一个框架,而是一个js库和adependency基于jQuery的进一步封装,去掉繁琐的DOM操作,采用数据驱动的MVC模块化库。这里涉及到MVC这个名词,不是很清楚。我自己的理解是,M其实就是一个Module模块,一个.html就是一个模块,V其实就是我们.html里面的DOM元素,C就是我们用来操作V的js脚本。。大概画了个简单的草图:不知道对不对,不对还望大家多多提宝贵意见,让自己更上一层楼,谢谢。为什么要使用angular.js?我不得不抱怨它。我仍然需要使用angular.js。我不想使用angular2。无论如何,让我开始使用ts.使用这个js库的一个关键原因是因为它可以去除繁琐的DOM操作。使用数据驱动的视图方式进行开发是非常高效的。如何使用angular.jsng-app加载入口应用模块varapp=angular.module('ngApp',[]);ng-init初始化数据,有点类似,letapp=newVue();

ng-controllercontroller有点类似于Vue中的data()属性。ng-controller控制器
ng-bind数据绑定有点类似于Vue中的v-bindng-model二-way数据绑定有点像Vue中的v-modelng-repeat数据循环有点像Vue中的v-for

使用ng-repeat循环数组

    {{x}}
ng-if为HTML添加选择功能。只有当表达式值为true时,当前元素才被添加到DOM树中,类似于vue中的v-ifng-show有点类似于v-showng-src有点类似于:srcng-click有点类似于@clickng-style有点像:styleng-class有点像:classng-show/ng-hide有点像jq的show(),hide()ng-disabled有点像:disabledng-checked有点像:checked$scope有点类似于Vue中的data()属性filter过滤器,又有点类似于Vue中的filter$scope.$watchvue中的watch属性今天就先到这里。其实应该有点先入为主,因为其实Vue是学习了angular.js的思想。这里,一个很重要的思维方式就是迁移思维。点击关注,第一时间了解华为云的新鲜技术~