素材巴巴 > 程序开发 >

angular js 自学笔记(一)

程序开发 2023-09-24 21:42:00


js中的mvc

         mvc设计模式,简单说来是将复杂的代码设计规范化,把应用的输入,处理,输出分开,M是指数据模型,V是指用户界面,C则是控制器。像我刚接触的SSH框架中,例如struts,就是利用mvc的设计模式。其中model(也就是数据模型)负责封装页面传来的参数,并交给业务进行处理,处理完后返回模型数据到页面进行显示,这一点angular js中的双向数据绑定成功的实现了。control负责进行业务处理,并将处理后的模型数据选择对应的视图view进行输出。

       刚刚接触angular js,对于接触js,css,html这些不久的我来说,这样东西十分神奇,在我以前的编码中,js就是js,就拿双向数据绑定来说,以前的我要实现这个,只有在js中获取input标签的内容,进行处理,再通过js的标签控制来显示,这样的代码肯定非常复杂,而angular js只需要一个简单的双花括号和ng-model,即可实现从js到view的双向绑定,大大节省了代码量。现在刚学angular js,我会在以后的学习中深入学习angular js的各种神奇地方,现在先记录对angular js的一些理解。

 

angular js 中的scope和rootscope

       $scope 的使用贯穿整个 AngularJS ,它与数据模型相关联,同时也是表达式执行的上下文.有了 $scope 就在视图和控制器之间建立了一个通道,基于作用域视图在修改数据时会立刻更新 $scope,同样的 $scope 发生改变时也会立刻重新渲染视图.

       $rootscope,AngularJS 应用启动并生成视图时,会将根 ng-app 元素与 $rootScope 进行绑定.$rootScope 是所有 $scope 的最上层对象,可以理解为一个 AngularJS 的全局作用域对象,因此一般不要在它上面创建过多的变量,这个道理和污染 Javascript 全局作用域是一样的.


TIP

         一个sublime的快捷键ctrl+e,可以实现快速的编码。

           一个简单例子:

             

          

           未完待续......






标签:

素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。