AngularJSAngular.js学习笔记 (一)

– angular中最重大的概念是命令(directive)

  • ng-model
    是双向数据绑定的命令,效果就是将近期因素的value属性和模型中的[user.name]确立绑定关系
    ### 模块(Module)
  • 我们得以经过angular.module创设三个模块
  • angular.module方法传递七个参数才是开创模块,一个参数是得到模块
    ### 控制器(Controller)

-常用艺术:<html lang=”en”
ng-app=”HelloApp”></html>//ng-app属性是采用ng的前提
<div
ng-controller=”HelloController”></div>//ng-controller属性放在包裹标签上,控制包裹内代码
js代码中:

  • var module = angular.module(‘HelloApp’, [])
  • module.controller(‘HelloController’, [‘$scope’,’$http’, function(a,b)
    {
    console.log(a);//打印的是$cope对象
    }]);
  • 透过$scope和视图关联
  • $scope.$watch(‘/*要监视是不是产生变化的值*/’,function(now,old){
    console.log(now);//以往输入的值
    console.log(old);//输入以前的旧值
    })
    -那里推荐三个ng的插件:AngularJS
    Batarang,安装后可以在chrome控制台下发现ng调试工具
    ### 表达式(expression)
    {{}}
    AngularJS表达式很像JavaScript表明式, 它们得以涵盖

文字、运算符和变量 如 {{ 5 + 5 }} 或 {{ firstName + ‘-’ + lastName }},

数字{{ 100 + 100 }},

字符串{{ ‘hello’ +   ‘angular’}} ,

对象{{ zhangsan.name }} ,

数组{{ students[10] }}

对比 JavaScript 表达式:

相同点: AngularJS 表明式可以分包字母,操作符,变量。

不相同点: AngularJS 表达式可以写在 HTML 中。 AngularJS
表明式不扶助标准判断,循环及卓殊。 AngularJS 表明式协理过滤器。

### 化解ng在加载页面时先出现表明式的bug
<style>
/* ng-cloak指令就是在NG执行已毕之后活动移除 */
[ng-cloak],
.ng-cloak {
display: none;
}
</style>
<body ng-app class=”ng-cloak”></body>或者<body ng-app
ng-cloak></body>

相关文章