发表于: 2017-05-22 23:30:16

1 987


今天完成的任务:

使用hbuilder将task2-4打包成了一个越狱版ios程序,android没有打包成功。

学习angular js。

1,angular是js的一个框架,通过指令实现功能。

2,angular的主要作用为数据的双向绑定,操作前后台的数据能使两边实时渲染。

3,angular直接把指令作为HTML的属性,直接在html书写逻辑,简化dom操作。

4,语法:

a,表达式{{}}:写在元素的内容区,作为元素的内容呈现。


b,指令:

ng-app:angular作用于此元素。

ng-init:设置变量的默认值,可写入多条语句。可写在ng-app内任意标签中。

ng-model:作为表单属性,把表单的value赋给一个变量。

ng-bind:将ng-bind的填充到此元素中,会覆盖元素本身内容,作用和innerHTML相同。

ng-repeat:复制此元素,通过x in y语句。

ng-controller:先将此属性绑定变量,再通过变量在js代码控制ng-app内数据:

<div ng-app="myApp" ng-controller="myCtrl">

   : <input type="text" ng-model="firstName"><br>
   : <input type="text" ng-model="lastName"><br>
   <br>
   姓名: {{firstName + " " + lastName}}

</div>

<script>
   var app = angular.module('myApp', []);
   app.controller('myCtrl', function($scope) {
       $scope.firstName = "John";
       $scope.lastName = "Doe";
   });
</script>


c,scope:联系html和controller,代表局部的作用域,rootScope代表全局作用域。


d,在js中通过.directive 函数自定义指令:使用驼峰法来命名一个指令, niHao, 但在使用它时需要以 - 分割, ni-hao。指令可通过tag名,属性名,类名,注释来调用。


明天计划的事情:

准备小课堂

继续学习angular


遇到的问题:

给ng-app绑定变量后,{{}}就无效了,不知为何。

//15
<div ng-app>
   <p>{{5+10}}</p>
</div>

//{{5+10}}
<div ng-app="a">
   <p>{{5+10}}</p>
</div>


收获:

如上


返回列表 返回列表
评论

    分享到