AngularJS简介

客户端模板 (Client Templates)

· AngularJS中，模板和数据都会被发送到浏览器中，然后在客户端进行装配。

            AngularJS是后端把模板，包括数据全都发送到浏览器上。浏览器再将数据填充到模板里面去。

 

MVC

• MVC核心概念：把管理数据的代码（model），应用逻辑代码（controller），向用户展示数据的代码（view）清晰的分离开。

• AngularJS应用中：

              控制器就是javascript类
              模型数据则被存储在对象的属性中
              视图就是Document Object Model

 

数据绑定(Data Binding)

• MVVM模式， AngularJS就是MVVM框架；
• 数据绑定可自动将model和view间的数据同步；
• AngularJS实现数据绑定的方式，可以让我们把model当作程序中唯一可信的数据来源。view始终是model的投影，当model发生变化时，会自动反应到view上。

经典模板系统中的数据绑定

• 大多数模板系统中的数据绑定都是单向的
• 把模板与model合并在一起变成view，如果在合并之后model就会发生变化，不会自定反映到view上（模板与model合并是在后端实现的）
• 用户在view上的交互也不会反映到model中，开发者必须写大量代码不断在view与model之间同步数据

AngularJS模板中的数据绑定

 

• 模板是在浏览器中编译的，在编译阶段产生了一个实时更新（live）的视图
• 不论在model或是view上发生了变化，都会立即反映到对方。
• model成为程序中唯一的数据来源，极大地简化了开发者需要处理的编译模型

 

依赖注入（DI）

• 依赖注入是一种软件设计模式，用来处理代码的依赖关系
• AngularJS的依赖注入只是简单的获取它所需要的东西，而不需要创建那些他们所依赖的东西

<script>

    var A = function(){
        this.getName = function(){
            return 'Tom';
        }
    }
    
    var B = function(aObj){
        //B 依赖于a
        document.writeObj(aObj.getName());
    }
    
    var a = new A;
    
    //a 注入 b
  var b = new B(a);
    
</script>