初识AngularJS

  AngularJs是javaScript的一个框架,以js编写的库,它通过指令扩展了html。

  一、引入angularJs的方式:

    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

  二、AngularJS 通过 ng-directives 指令扩展了 HTML:

    1. ng-app 指令定义一个angular应用程序;

    2. ng-model 指令将元素值(比如输入域的值)绑定到应用程序;

    3. ng-bind 指令把应用程序数据绑定到HTML视图;

    4. ng-init  指令为应用程序定义一个初始值;

1 <div ng-app=" " ng-init="name='John'">
2     <input type="text" ng-model="name" />
3     <p>输入的姓名为:{{ name }}</p>
4 </div>

    5. ng-repeat 指令重复一个HTML元素,可用于循环数组;

    6. 创建自定义指令:使用 .directive 函数来添加自定义的指令,驼峰式命名myName,使用时以“-”分割my-name

 1 <div ng-app="myApp">
 2     <my-name></my-name>
 3 </div>
 4 <script>
 5      var app=angular.model("myApp",[]);
 6      app.directive("myName",function(){
 7         return{
 8            template:"<h1>自定义指令!</h1>"
 9         }
10      });
11 </script>    

 

  

 

posted @ 2018-08-03 14:36  萌慢慢  阅读(108)  评论(0编辑  收藏  举报