zoukankan      html  css  js  c++  java
  • angularjs(1)

    1.angularjs的下载地址为:https://angularjs.org

    2.什么是angularsjs????angularjs是对HTML的扩展,吸收了传统的MVC基本原则,将管理数据的模型(model),应用逻辑代码(controller),以及向用户展示数据的代码(view)清晰的分开,从而解决静态网页技术构建动态应用的不足,同时省去了一些繁琐的DOM操作及事件监听操作。

    3.angularjs的主要特征:

      1)数据绑定:简单来说就是UI的某个部分与JavaScript某些属性之间的互相映射。在传统情况下,我们需要手动的去修改dom,进而将这些变化展示出来,而当实现数据绑定后,界面的操作能实时的反应到数据,数据的变更能实时的反应到界面展现上。

      2)依赖注入:在上例中,SomeController可以获取它所需要的$scope的对象,而不需要创建它。当然,我们也可以自定义一些服务,注入到需要使用的控制器中。总之,我们的类只需要简单的获取它所需要的东西,而不需要创建它所依赖的东西。这里需要强调的是,依赖注入需按照上面的形式规则,避免代码压缩产生错误。

      3)指令:是angularjs最强大的功能之一,是对html扩展的核心部分,上例中的{{}},ngController都属于指令,{{}}实现的是数据绑定,ngController实现的是控制器对视图的控制。angularjs内置了很多指令,帮我们定义视图,同时我们也可以自定义指令,实现所需的功能。

    <!DOCTYPE html>
    <html ng-app="myTest">
    <head>
    <meta charset="utf-8">
    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
    </head>
    <body>
    
        <div ng-controller="SomeController">
            <hello></hello>   //<hello>为我们创建的指令
        </div>
        <script>
            var myTest = angular.module("myTest", []);
            myTest.directive("hello", function() {
                return {
                    restrict: "E",
                    template: "<h1>Hello world!</h1>",
                    replace: true
                };
            });
        </script>
    </body>
    </html>

      4)过滤器(filter):通过某种规则处理接收到的值,最后返回处理后的结果。内置的过滤器有:currency(货币),date(日期),json(格式化json对象),lowercase(小写),uppercase(大写),limitTo(限制个数),number(格式化数字),orderBy(排序),filter(匹配子串)。同时,我们也可以根据需要自定义过滤器。

    5)路由(route):将控制器、视图模板及浏览器当前地址栏信息进行深层链接。在应用中,可以通过调用$routeProvider服务上的函数来创建路由,把需要创建的路由当成一个配置块传给这些函数即可。也正因为路由的存在,我们不会将所有的东西都放在一个主视图中,而是创建一个布局模块,然后再用这个模块容纳其他东西,同时ng-view指令告诉angular将视图显示在哪。在实际的开发中,很少用到angular的内置路由ngRoute,而是使用基于ngRoute开发的第三方路由模块ui.router,在这里分享两篇文章

    1.http://www.html-js.com/article/Front-end-source-code-analysis-original-uirouter-source-code-analysis  

    2.http://www.cnblogs.com/liulangmao/p/4155015.html

  • 相关阅读:
    ab命令做压测测试
    用js两张图片合并成一张图片
    Web全景图的原理及实现
    深入理解Java中的IO
    Spring AOP详解
    spring @Transactional注解参数详解
    优化MyBatis配置文件中的配置
    使用MyBatis对表执行CRUD操作
    @requestBody注解的使用
    url 拼接的一个模块furl
  • 原文地址:https://www.cnblogs.com/webliu/p/5233375.html
Copyright © 2011-2022 走看看