Open Wscats opened 8 years ago
1.ng-app
指令定义一个AngularJS应用程序
var app = angular.module("angularDemo", []);
2.ng-controller
指令定义了应用程序控制器,控制作用域
app.controller('studentCtrl', function($scope, $rootScope) {
//数据操作
})
解决压缩的一种写法,把他整个传回调函数的过程,改写成数组的形式存放
app.controller('studentCtrl', ['$scope', '$rootScope',function($scope, $rootScope) {
//数据操作
}])
3.$scope
为控制器作用域、控制范围内生效的对象,只在所在的控制器生效
$scope.wsscat = 'a';
$scope也是应用在HTML(视图)和JavaScript(控制器)之间的纽带,实现单向绑定
HTML(视图)就可以用{{wsscat}}渲染数据
4.表达式的{{}}
双大括号或者’ng-bind‘
把数据绑定到HTML(视图上)
{{a}}
<p ng-bind="a">
5.管道字符(|)给表达式{{}}添加过滤器
例如{{wsscat|uppercase}}
,{{money|currency:'&'}}
6.ng-model
输入结果,并把结果传递给对应控制器中$scope
<input ng-model="wsscat" value="" />
实现双向绑定
1.ng-src
ng-src
指令里面需要{{}},其他ng指令一般只要直接写$scope所带的属性<img ng-src="{{url}}" />
2.$rootScope
$rootScope
可以实现控制器之间的数据交换,但是一旦刷新就会丢失3.ng-style ng-style指令,如果要用$scope传入一个css的样式表,要用json格式传递
ng-style="style"
4.ng-show isexpand在ng-show里面不能带{{}},不然会认为永远字符串为真
<span ng-show="isexpand">...</span>
$scope.isexpand = true
当它<span ng-show="isexpand">...</span>"
这样写时候为标签的属性 当它<span class="isexpand?ng-show:ng-hide">...</span>
这样写的时候表现为css类5.ng-前缀的意思 不然DOM来解析,等到angular加载完才执行ng-自身指令 例如
<img src="{{url}}" />
,会先加载{{url}}地址的图片,报404错误,再等到angular解析才读取出图片 一般需用$scope把变量带到视图中的src,href,style,class等我们就带ng-前缀,如果不是的话,按原生写法即可6.过滤器
{{date| date:'yyyy-MM-dd hh:mm:ss EEEE'}}
date要传UNIX时间戳$scope.date = 1448864369815;