标签：orm 选择 控制 简单 作用域 type 建立连接 步骤 script
安装
1.官网http://angularjs.org/下载安装
2.开源库http://www.bootcdn.cn/下载安装
Angular除了提供一些需要最新浏览器支持的功能外，同时提供以下标准功能：
功能丰富的好处就是你不需要额外费精力去挑选第三方的类库，然而，这也同样让你没得选择，即使你并不需要这些功能（最新发布的Angular4貌似已经意识到了这个问题）
MVC
MVC即“模型 - 视图 - 控制器”的简称，一种设计模式，MVC的从逻辑上将代码清晰地分割为三层，这样可以对每个部分进行独立开发、测试和维护。
模型/Model - 服务层（service）负责维护数据
视图/View - 展示层（diretive）负责将数据展现给用户
控制器/Controller - 控制层（control）负责控制Model和View之间的交互
应用场景
开发环境 <script src="angular.js"></script>
angualr应用创建基本步骤
1 <!DOCTYPE html> 2 <html lang="en" ng-app="demo"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>demo</title> 6 <link rel="stylesheet" href="bootstrap.css"> 7 8 //link标记允许当前文档和外部文档之间建立连接，但是只能在head标签里面用 9 <script src="angular.js"></script> 10 </head> 11 <body> 12 {{1+1}} {{msg}} 13 <div id="box" ng-controller="oneCtrl"> 14 {{1+1}} {{msg}} 15 </div> 16 <script> 17 (function(){ 18 angular.module("demo",[]) 19 demo.controller("oneCtrl",function($scope){ 20 21 //学习中一般这样用 当代码上线压缩后 这段代码会有问题 22 23 demo.controller("myctrl"["$scope","$http"],function (scope,http) { 24 // 开发中要用的表达式 25 26 27 $scope.msg = "hello angular!" 28 }) 29 })() 30 </script>
从其他博客整理来的知识点
1.ng-app,ng-app="",ng-app="demo"三者的区别
答：ng-app有一个默认的模块。如果有多个ng-app，默认是加载第一个，而且只加载第一个。ng-app=“自定义的模块” 是一个使用了自定义的模块，该自定义的模块继承了那个初始的默认的模块，可以调用初始的默认的模块的方法第二者是第三者的特例。
2.为什么没有ng-app,也可以启动angular?
答：如果在当前的页面中包含有ng-app这个指令，angular会自动启动，如果不想在当前的页面中显示标识ng-app,我们可以代码的方式手动启动，即通过angular.bootstrap(document,["demo"])手动启动，等价于ng-app="demo";
3.angular.bootstrap(document.getElementById("box"),["demo"])的作用？
答：angular.bootstrap(启动位置,数组)，启动位置：表示管理范围，数组：表示把数组中的当成启动模块
控制器之间的继承
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>demo</title> 6 <link rel="stylesheet" href="bootstrap.css"> 7 <script src="angular.js"></script> 8 </head> 9 <body> 10 {{1+1}} {{msg}} 11 <div id="box" ng-controller="oneCtrl"> 12 {{1+1}} {{msg}} 13 </div> 14 <script> 15 (function(){ 16 angular.module("demo",[]) 17 .controller("oneCtrl",function($scope){ 18 $scope.msg = "hello angular!" 19 }) 20 angular.bootstrap(document,["demo"]); 21 angular.bootstrap(document.getElementById("box"),["demo"]); 22 })() 23 </script> 24 </body> 25 </html>
bootstrap插件使用官网上 http://getbootstrap.com查阅使用
以后仔细学过再来做笔记
控制angular应用程序的数据。
控制器是JavaScript对象，构造函数
模块对应执行应用的HTML元素
模块可在angular 应用中添加控制器，指令，服务等。
作用域是在应用在HTNL(视图)和JS（控制器）之间
当angular创建控制器时可以将$scope对象当做参数传递
scope是一个对象，有可用方法和属性
简单的理解：$scope 局部作用域
$rootscope 全局作用域
ng-click/dblclick 点击/双击
ng-mouseover/out
ng-keydown/up
ng-focus/blur 获取焦点
ng-submit
指令 是扩展HTNL 为内置的指令来为应用添加功能 带有前缀 ng-
ng-init 初始化应用程序数据
ng-model 绑定到应用程序（比如输入的域的值）
ng-repeat 对于集合中（数组中）的每个项 克隆一次HTML元素（ 指令用于循环输出指定次数的 HTML 元素）
1 <!doctype html> 2 <html lang="en" ng-app="zidingyi"> 3 <head> 4 <meta charset="utf-8"> 5 <title>repeat</title> 6 <meta name="keywords" content=""> 7 <meta name="description" content=""> 8 <script src="angular.min.js"></script> 9 </head> 10 <body> 11 <ul ng-controller="myctrl"> 12 <li ng-repeat="persen in data"> 13 <!-- 循环（for in 循环） --> 14 <span>年龄:{{persen.name}}</span> 15 <span>年龄:{{persen.age}}</span> 16 <span>年龄:{{persen.score}}</span> 17 </li> 18 </ul> 19 <script> 20 var app=angular.module("zidingyi",[]) 21 app.controller("myctrl",function ($scope) { 22 $scope.data=[ 23 {"name":"张三","age":22,"score":98}, 24 {"name":"李四","age":23,"score":70}, 25 {"name":"王五","age":28,"score":90}, 26 {"name":"赵六","age":31,"score":100} 27 ]; 28 }) 29 </script> 30 </body> 31 </html>
运行结果
标签：orm 选择 控制 简单 作用域 type 建立连接 步骤 script
原文地址：http://www.cnblogs.com/huo-94/p/6895745.html
