发表于: 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>
收获:
如上
评论