【AngularJS】Scope作用域

来源：互联网发布：pc安全软件编辑：程序博客网时间：2024/05/22 01:29

作用域指的是app的操作范围，详细介绍菜鸟教程和W3School都有；下面是一点小思考；

首先比较下Demo1和Demo2有什么不同；

Demo1

<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"><h1 ng-model="carname">{{carname}}</h1><!-- 这里表示，我的模型的名字就叫carname --></div><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope) {    $scope.carname = "Volvo";});</script><p>控制器中创建一个属性名 "carname"，对应了视图中使用 {{ }} 中的名称。</p></body></html>

Demo2

<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"><h1>{{carname}}</h1><!-- 这里表示，我的模型的名字就叫carname --></div><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope) {    $scope.carname = "Volvo";});</script><p>控制器中创建一个属性名 "carname"，对应了视图中使用 {{ }} 中的名称。</p></body></html>

红色部分可以看出，Demo1是标准写法，Demo2是简略写法；因为按照我们之前的教程，应该是Demo那样写；ng-app和ng-controller先划分下势力范围。

然后组件就要在具体的实例标记；AngularJS的好处就是用双大括号来标记model，这样，就不用写ng-model了；

为什么，因为程序员很''懒''；

Demo1和Demo2结果都是一样的；就是比较下不同；让大家了解下；

截图：

阅读全文

0 0