初识角体验(三)

  

  哈喽,大家好,不知不觉又过了一个星期,感觉一周一周过得好快啊,上周的分享我们说到了角的一个主要的特性,双向数据绑定,这周呢,我会把其他特性以代码的形式给大家介绍! !   

  

  <>强特性二:模板   

  

  在AngularJS中,一个模板就是一个HTML文件。但是HTML的内容扩展了,包含了很多帮助你映射模型到视图的内容。   

  

  HTML模板将会被浏览器解析到DOM中.DOM然后成为AngularJS编译器的输入.AngularJS将会遍历DOM模板来生成一些指导,即,指令(指令)。所有的指令都负责针对视图来设置数据绑定。   

  

  我们要理解AuguarJS并不把模板当做字符串来操作。输入AngularJS的是DOM而非字符串。数据绑定是DOM变化,不是字符串的连接或者innerHTML变化。使用DOM作为输入,而不是字符串,是AngularJS区别于其它的框架的最大原因。使用DOM允许你扩展指令词汇并且可以创建你自己的指令,甚至开发可重用的组件。   

        var m=angular.module(“高清”,[]);   m.controller (ctrl,[美元范围,函数(范围美元){   范围。p_w_picpaths=[   {“p_w_picpath”:“img/p_w_picpath_01。png”、“描述”:“01形象描述"},   {“p_w_picpath”:“img/p_w_picpath_02。png”、“描述”:“形象02描述”},   {“p_w_picpath”:“img/p_w_picpath_03。png”、“描述”:“形象03描述”},   {“p_w_picpath”:“img/p_w_picpath_04。png”、“描述”:“04形象描述"},   {“p_w_picpath”:“img/p_w_picpath_05。png”、“描述”:“形象05描述”}   ];   }));   & lt; div ng-controller=" ctrl”比;   & lt; ul>   & lt;李ng-repeat=皃_w_picpaths p_w_picpath”比;   & lt; img ng-src=" https://www.yisu.com/zixun/" p_w_picpath "缩略图”alt=" p_w_picpath。描述”比;   & lt;/li>   & lt;/ul>   & lt;/div>      

以上代码就是通过遍历范围。p_w_picpaths的数据把img一一通过李输出,这就是一个模板。

  

当然,真正的项目的数据都是通过接口去读取的,在这里我只能以假的数据来定义。

  

<>强特性三:MVC

  

针对客户端应用开发AngularJS吸收了传统的MVC基本原则.MVC或者Model-View-Controll设计模式针对不同的人可能意味不同的东西.AngularJS并不执行传统意义上的MVC,更接近于MVVM (Model-View-ViewModel)。

  

<>强特性四:依赖注入(Dependency Injection,即DI)

  

AngularJS拥有内建的依赖注入子系统,可以帮助开发人员更容易的开发,理解和测试应用。

  

DI允许你请求你的依赖,而不是自己找寻它们。比如,我们需要一个东西,DI负责找创建并且提供给我们。

  

<>强特性五:指令(指令)

  

指令可以用来创建自定义的标签。它们可以用来装饰元素或者操作DOM属性。

     

好啦,以上就是这周分享的内容,下周开始我会以节的形式给大家分享角知识点和注意事项,让我们这些零基础的朋友们,能够快速进步! ! !

初识角体验(三)