1.
ng-app,定义一个angular-js应用程序
ng-model,把元素值绑定到app
ng-bind, 把应用程序值绑定到html
ng-init, 初始化Angularjs应用程序变量; <div ng-app="" ng-init="firstName='John'"> //未通过;
#####################################
1.数据模型(modal)主要提供数据。它不会和视图(view)直接操作
2.controller保存modal提供的数据,与视图进行操作。
3.view是视图,也就是页面展示。
#####################################controller
1.不要视图复用controller,一个控制器一般只负责一小块视图(一一对应);
2.不要在controller中直接操作DOM,这不是控制器的职责,操作DOM要使用指令derective(见上节教程);
3.不要在controller中进行数据过滤的操作,有专门的filter服务来实现这一块;
4.一般来说,不同的controller之间是不互相调用的,控制器的交互一般通过事件进行。
function controller($scope){$scope.greeting = {text : 'hello'};}
#####################################
<div ng-app="myapp2" id="myapp2" ng-init="person={firstName:'John',lastName:'Doe233'}">
<p>姓为 {{ person.lastName }}</p></div><script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope) {$scope.firstName= "John";$scope.lastName= "Do322323e";});var app2 = angular.module('myapp2', []);angular.bootstrap(document.getElementById("myapp2"), ['myapp2']);</script>多个app的绑定,只有第一个可以自动绑定;
#####################################
#####################################
表达式{{ expression }} //同ng-bind,可以包含文字,预算符,变量
ng-app指令定义了应用, ng-controller 定义了控制器。
控制器是 JavaScript 对象,由标准的 JavaScript 对象的构造函数 创建。 //这玩意儿的意义是什么呢?
<div ng-app="myApp" ng-controller="myCtrl">
名: <input type="text" ng-model="firstName"><br>名: <input type="text" ng-model="lastName"><br><br>姓名: {{firstName + " " + lastName}}</div><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope) {$scope.firstName = "John";$scope.lastName = "Doe";});</script>--链接到外部文件;只需要把 <script> 标签中的代码复制到名为 personController.js 的外部文件中即可
>ng-repeat //<div ng-app="" ng-init="names=['Jani','Hege','Kai']"> <li ng-repeat="x in names">
2.过滤器,filters
currency, filter,lowercase,oerderby :expressions,uppercase
3.AngularJS XMLHttpRequest
4.显示表格
显示序号 ($index)
使用 $even 和 $odd
5.AngularJS SQL
允许跨域,header("Access-Control-Allow-Origin: *");
6.HTML DOM
ng-disabled = "true" true/false可以使用表达式;
ng-show="true"
ng-hide
7.HTML事件
ng-click="count = count + 1"
8.angular 模板
模块定义了一个应用程序。
模块是应用程序中不同部分的容器。
模块是应用控制器的容器。
控制器通常属于一个模块。
//可放到外部js.
9.angular表单,表单验证;
<!DOCTYPE html>
<html><script src= "http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script><body><div ng-app="myApp" ng-controller="formCtrl"><form novalidate>First Name:<br><input type="text" ng-model="user.firstName"><br>Last Name:<br><input type="text" ng-model="user.lastName"><br><br><button ng-click="reset()">RESET</button></form><p>form = {{user }}</p><p>master = {{master33}}</p></div><script>var app = angular.module('myApp', []);app.controller('formCtrl', function($scope) {$scope.master33 = {firstName:"John", lastName:"Doe"};$scope.reset = function() {$scope.user = angular.copy($scope.master33);};$scope.reset();});</script></body></html>
10.angularjs api