AngularJS控制器--理解小结

AngularJS的控制器是一个函数,用来向视图的作用域添加功能,可用控制器给作用域对象设置初始状态,并自定义行为。

当在页面上创建一个新的控制器,Angular会生成并传递一个新的$scope给这个控制器,可在其中初始化$scope,

由于Angular会负责处理控制器的实例化过程,我们只需编写构造函数。

function firstController($scope){
   $scope.message="hello";
}

但是上述写法是在全局作用域中创建的函数,这样会污染全局命名空间。

合理的方式是先创建一个模块,并在模块中创建控制器。

var app = angular.module(‘app‘,[]);
app.comtrolle(‘firstController‘,function($scope){
   $scope.message=‘hello‘;
});

只要创建控制器作用域中的函数,就能创建在视图中可以用的自定义操作。Angular允许我们在视图中向调用普通数据一样调用$scope上的函数。

后续更新~

时间: 2024-10-23 07:17:15

AngularJS控制器--理解小结的相关文章

AngularJS模块——理解小结

在JS中,将函数代码全部定义在全局命名空间上是很不明智的. 在Angular中,将控制器代码封装在模块(module)单元中. 在AngularJs中,模块是定义应用的最主要的方式,模块里面存放了主要的应用代码, 一个应用可以包含多个模块,每一个模块都包含了定义了具体功能的代码. 使用模块的有点:1.可以保持全局命名空间的清洁 2. 应用可以以任何的顺序加载代码的各个部分 AngularJS中声明模块:   angular.module(name,requires), angular.modul

AngularJS 深入理解 $scope 转载▼

AngularJS 深入理解 $scope 转载▼ (2015-04-07 14:09:50) $scope 的使用贯穿整个 AngularJS App 应用,它与数据模型相关联,同时也是表达式执行的上下文.有了$scope 就在视图和控制器之间建立了一个通道,基于作用域视图在修改数据时会立刻更新 $scope,同样的 $scope发生改变时也会立刻重新渲染视图. 有了 $scope 这样一个桥梁,应用的业务代码可以都在 controller 中,而数据都存放在controller 的 $sco

《Pro AngularJS》学习小结-01

<Pro AngularJS>该书以一个SportsStore案例为主线铺开. 一.开发环境设置 该书中所用的server开发环境是Deployed,从来没听说过,而且作者也说该server没什么人用,我干脆弃用之.其他的环境包括 NodeJS--这个必须装 karma--测试环境,前期还没有用到,以后认真研究,毕竟AngularJS一大特点是Unit Test bootstrap--这个现在应该普遍使用了,O(∩_∩)O webstorm--现在唯一支持AngularJS插件的IDE 我基本

angularjs控制器之间通信,事件通知服务

service要记住一点就是所有的services都是singleton(单例)的,service更多的是做一些业务逻辑,数据交互.当然,利用单例这特点也可以用来做不同控制器间的通信.控制器间的通信也有多种做法:AngularJS控制器controller如何通信?. 利用作用域继承的方式.即子控制器继承父控制器中的内容 基于事件的方式.即$on,$emit,$boardcast这三种方式 服务方式.写一个服务的单例然后通过注入来使用 第一种还是有些局限性,第二种用起来并不太方便(或者个人不习惯

AngularJS 控制器的方法

AngularJS 控制器也有方法(变量和函数) <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta http-equiv="X-UA-Compatible"content="IE=edge" /> <meta

AngularJS控制器

AngularJS 控制器 控制 AngularJS 应用程序的数据,控制器是常规的 JavaScript 对象. 1. angular.module(name, [requires], [configFn]); name:字符串类型,代表模块的名称: requires:字符串的数组,代表该模块依赖的其他模块列表,如果不依赖其他模块,用空数组即可: configFn:用来对该模块进行一些配置. <!-- 双向绑定,应用程序名字和控制器名字 --> <div ng-app="my

【06】AngularJS&#160;控制器

AngularJS 控制器 AngularJS 控制器 控制 AngularJS 应用程序的数据. AngularJS 控制器是常规的 JavaScript 对象. AngularJS 控制器 AngularJS 应用程序被控制器控制. ng-controller 指令定义了应用程序控制器. 控制器是 JavaScript 对象,由标准的 JavaScript 对象的构造函数 创建. <div ng-app="myApp" ng-controller="myCtrl&q

AngularJS控制器和AngularJS过滤器的学习(3)

前面简单的学习了AngularJS的表达式和指令,就可以说大概对AngularJS有了一定的了解吧,嘿嘿,下面就来总结学习一下AngularJS的控制器和过滤器哦. 说起来AngularJS控制器,其实就是常规的JavaScript对象.来控制AngularJS应用程序的数据. 一.AngularJS的控制器 <1>.AngularJS 控制器 在浏览器中浏览的结果是: AngularJS应用程序被控制器控制,ng-controller指令定义了应用程序控制器,控制器是JavaScript对象

AngularJS控制器和过滤器学习(三)

AngularJS控制器 AngularJS 控制器 控制 AngularJS 应用程序的数据. AngularJS 控制器是常规的JavaScript对象 <h2>AngularJS 控制器属性</h2> <div ng-app="" ng-controller="MyController"> <p>姓名:<input type="text" ng-model="person.na