angularjs的Controller as
<html ng-app="notesApp">
<head><title>Notes App</title></head>
<body ng-controller="MainCtrl as ctrl">
<form ng-submit="ctrl.submit()" name="myForm">
<input type="text"
name="uname"
ng-model="ctrl.user.username"
required
ng-minlength="4">
<span ng-show="myForm.uname.$error.required">
This is a required field
</span>
<span ng-show="myForm.uname.$error.minlength">
Minimum length required is 4
</span>
<span ng-show="myForm.uname.$invalid">
This field is invalid
</span>
<input type="password"
name="pwd"
ng-model="ctrl.user.password"
required>
<span ng-show="myForm.pwd.$error.required">
This is a required field
</span>
<input type="submit"
value="Submit"
ng-disabled="myForm.$invalid">
</form>
<script src="http://riafan.com/libs/angular.js"></script>
<script type="text/javascript">
angular.module('notesApp', [])
.controller('MainCtrl', [function() {
var self = this;
self.submit = function() {
console.log('User clicked submit with ', self.user);
};
}]);
</script>
</body>
</html>
ng-controller="MainCtrl as ctrl"，允许数据可以在同一个页面的不同的controller之间自由穿梭。。。
Create a reference to this in our controller.
angular.module('app').controller('MainCtrl', function ($scope){
var self = this;
Remove $scope from our controller dependency, and use self instead of $scope.
angular.module('app').controller('MainCtrl', function (){
var self = this;
self.message = 'hello';
self.changeMessage = function(message){
self.message = message;
};
});
angularjs的Controller as的更多相关文章
- AngularJS 中 Controller 之间的通信
用 Angular 进行开发,基本上都会遇到 Controller 之间通信的问题,本文对此进行一个总结. 在 Angular 中,Controller 之间通信的方式主要有三种: 1)作用域继承.利 ...
- angularjs 的controller的三种写法
AngularJS 的controller其实就是一个方法,它有三种写法: 第一种: <pre name="code" class="javascript" ...
- Angularjs中controller的三种写法
在Angular中,Directive.Service.Filter.Controller都是以工厂方法的方式给出,而工厂方法的参数名对应着该工厂方法依赖的Service.angularjs中cont ...
- Angularjs之controller 和filter（四）
Controller组件(http://www.angularjs.cn/A00C) 在AngularJS中,控制器是一个Javascript函数(类型/类),用来增强除了根作用域以外的作用域实例的. ...
- 在AngularJS的controller外部直接获取$scope
为了防止无良网站的爬虫抓取文章,特此标识,转载请注明文章出处.LaplaceDemon/SJQ. http://www.cnblogs.com/shijiaqi1066/p/5560843.html ...
- angularJS的controller之间如何正确的通信
AngularJS中的controller是个函数,用来向视图的作用域($scope)添加额外的功能,我们用它来给作用域对象设置初始状态,并添加自定义行为. 当我们在创建新的控制器时,angularJ ...
- angularjs 外部调用controller中的方法
angular.element(document.querySelector('[ng-controller=mainCtrl]')).scope().viewGo('tab.VIPPay_Succe ...
- 【angularJS】Controller控制器
1. 定义 控制器(Controller)在AngularJS中作用是增强视图(View),AngularJS控制器是一个构造方法,用来向视图(View)中添加额外功能. ng-controller指 ...
- AngularJS-01.AngularJS,Module,Controller,scope
1.AngularJS 一个构建动态Web应用程序的结构化框架. 基于JavaScript的MVC框架.( MVC ---- Model(模型).View(视图).Controller(控制器) ) ...
- angularJS中controller的通信
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
随机推荐
- Codeforces Round #284 (Div. 1) C. Array and Operations 二分图最大匹配
题目链接: http://codeforces.com/problemset/problem/498/C C. Array and Operations time limit per test1 se ...
- 51单片机RAM 数据存储区学习笔记
转自:http://www.eepw.com.cn/article/216237_2.htm 1.RAM keil C语言编程 RAM是程序运行中存放随机变量的数据空间.在keil中编写程序,如果当前 ...
- 深入理解JAVA集合系列一：HashMap源码解读
初认HashMap 基于哈希表(即散列表)的Map接口的实现,此实现提供所有可选的映射操作,并允许使用null值和null键. HashMap继承于AbstractMap,实现了Map.Cloneab ...
- Genymotion-ARM-Translation_v1.1安装报“an error occured while deploying the file”
如上图,在将Genymotion-ARM-Translation_v1.1.zip拖动Genymotion虚拟机中报了图中错误,在百度后找到了解决办法,下面是我的操作步骤 1.下载re管理器之类的ap ...
- Reverse Words in a String II
Given an input string, reverse the string word by word. A word is defined as a sequence of non-space ...
- ArrayList底层实现
ArrayList 底层是有数组实现,实际上存放的是对象的引用,而不是对象本身.当使用不带参的构造方法生成ArrayList对象时,实际会在底层生成一个长度为10的数组 当添加元素超过10的时候,会进 ...
- 初入码田--ASP.NET MVC4 Web应用之创建一个空白的MVC应用程序
初入码田--ASP.NET MVC4 Web应用开发之一 实现简单的登录 初入码田--ASP.NET MVC4 Web应用开发之二 实现简单的增删改查 2016-07-29 在此之前,需要一台电脑( ...
- mock测试SpringMVC controller报错
使用mock测试Controller时报错如下 java.lang.NoClassDefFoundError: javax/servlet/SessionCookieConfig at org.spr ...
- jmeter 正则表达式提取
引用名称:自己定义的变量名称,后续请求将要引用到的变量名,如填写的是:id,后面的引用方式是${id} 正则表达式:提取内容的正则表达式,相当于lr中的关联函数 [() 括起来的部分就是需要提 ...
- 【Python】Python简介
Python是一种既使用简单又功能强大的高级编程语言,同时支持面向过程的编程和面向对象的编程. 官方对python的介绍:Python 是一种简单易学,功能强大的编程语言,它有高效率的高层数据结构,简 ...