angularjs入门学习一【核心理念】

                                                                                                          angular中常见的核心理念

一、客户端模版

   在传统多页面web应用程序通过组装和拼接数据来创造HTML（后台进行相关操作，并形成HTML页面），并将之发送至浏览器进行页面解析。而某种程度上Ajax应用（即单页面应用，异步更新）也可以实现对浏览器页面传送更新（局部）。而Angular则是后台将数据和模版传送到浏览器，然后再在浏览器中进行组装、解析页面内容。而这一过程中服务器仅作为提供页面静态资源和所需数据而存在。

在这里通过一个小小的例子来简单的描述下

 


 
{{greeting.text}}, World

下面是controllers.js代码

function HelloController($scope) {$scope.greeting = { text: 'Hello' };
}

         而当在input中进行输入时，你会惊奇的发现，Hello字段会即时的更新为你所输入的文本内容，而这一些得益于其双向的数据绑定特性，而其数据绑定通过ng-model和{{}}双大括号进行绑定（在这里不做详细解释）。

        在上述例子中，我们可以很轻易的发现，浏览器不是直接输出Hello,World的字符转换，而是组织了可以改变的‘Hello",而个人理解是’，World'部分作为模版中的内容固定不变，而我仅仅去改变我们需要的Hello文本部分内容。

      而与我们当前使用的很多方法比较，我们可以发现angualr的一些特别之处：

    【1】无需用class或id来区分绑定的事件监听

    【2】在HelloController中设置greet.text为hello时，并未进行事件的注册监听，也没有写任何回调函数

    【3】HelloController仅作为一个普通的js类，并未继承angular提供的任何东西，也无需创建$scope对象来进行数据获取

二、模型(model)-视图(view)-控制器(controller)------MVC

   【1】MVC核心理念：在的代码之间 明确分离管理数据（模型），应用程序逻 辑（ 控制器），并将数据给用户视图

             在angular中视图层就是DOM，控制器js类，模型数据存储在对象属性中。

   【2】MVC优点：代码结构组织清晰，易于理解和程序的扩展，维护和测试

三、数据绑定

   概念理解： 将页面中某一部分映射到js属性，让其自动同步，数据的移动从一个地方到另一个地方也是大部分自动完成【结合上述例子进行理解】  

四、依赖注入（DI）：一种软件设计模式，用来处理代码间依赖关系

   特性：由外接依赖注入，无需主动需要和寻找依赖，即不用通过new来创建对象便可以使用对象，如上例中的$scope对象

五、指令

通过框架核心中包含的DOM转换引擎，可以进行HTML语法的扩展，而如ng-controller,ng-model均为其HTML扩展指令。而其自带的很多标识符也可以帮助我们定义试图。

六、下面通过借用别人的一张图来给展示angularjs内核结构各层关系

个人暂时还不能很好理解，所以 不做解释，待后面理解清楚再做解释，如果有高手可以帮我这个解答下的话，麻烦不要吝啬你的评论了哦~~~

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！