h5js課件angularjs最常用八種功能

1、AngularJS 最常用的八種功能 HYPERLINK /archives/author/johnyannj o View all posts by 大巖不燦 大巖不燦發(fā)表于 HYPERLINK /archives/99.html o 上午9:46 2014年2月26日瀏覽 71,531 次第一 迭代輸出之ng-repeat標(biāo)簽ng-repeat讓table ul ol等標(biāo)簽和js里的數(shù)組完美結(jié)合12345 is person.age years old.你甚至可以指定輸出的順序：1第二 動(dòng)態(tài)綁定之ng-model標(biāo)簽任何有用戶輸入，只要是有值的html標(biāo)簽，都可以動(dòng)態(tài)綁定js中的變量，而且

2、是動(dòng)態(tài)綁定。1對(duì)于綁定的變量，你可以使用 直接引用1you input password is password如果你熟悉fiter，你可以很容易的按你的需要格式輸出11288323623006 | date:yyyy-MM-dd HH:mm:ss Z第三 綁定點(diǎn)擊事件之ng-click事件使用ng-click你可以很容易的為一個(gè)標(biāo)簽綁定點(diǎn)擊事件。1當(dāng)然前提是你要在$scope域中定義的自己的pressMe方法。和傳統(tǒng)的onclick方法不同，你甚至可以為ng-click方法傳遞一個(gè)對(duì)象，就像這樣：12345當(dāng)然還有ng-dblclick標(biāo)簽第四 分支語句之ng-switch on、ng-if

3、/ng-show/ng-hide/ng-disabled標(biāo)簽分支語句讓你在界面上都可以寫邏輯判斷。1234567891011121314you are a boyyou are a girlyou may be a fatheryou may be a motherplease input your babys name:第五 校驗(yàn)語法之ng-trim ng-minlength ng-maxlength required ng-pattern 等標(biāo)簽表單中的輸入框，你可以使用上面的標(biāo)簽來實(shí)現(xiàn)對(duì)用戶輸入的校驗(yàn)。從字面意思上你已經(jīng)知道了它們的意思。123你可以通過 $scope.yourForm.

4、inputText.$error.required 來判斷輸入框是否為空你可以通過 $scope.yourForm.inputText.$invalid 來判斷輸入的內(nèi)容是否滿足ng-pattern，ng-maxlength，maxlength你通過$scope.userNum獲得的輸入內(nèi)容是去掉前后空白的，因?yàn)閚g-trim的存在。第六 下拉框之ng-options標(biāo)簽ng-options是為下拉框?qū)ｉT打造的標(biāo)簽。1下拉框中顯示的是，當(dāng)你選中其中一個(gè)的時(shí)候，你可以通過yourSelected得到你選中的person.id.第七 控制css之ng-style標(biāo)簽ng-style幫你輕松控制你的

5、css屬性1your color你可以通過給myColor賦值的形式來改變你想要的效果，就像這樣：12$scope.myColor=color:blue;$scope.myColor=cursor: pointer,color:blue;第八 異步請(qǐng)求之$http對(duì)象。AngularJS 提供了一個(gè)類似jquery的$.ajax的對(duì)象，用于異步請(qǐng)求。在AngularJS中對(duì)異步操作是推崇至極的，所以$http的操作都是異步的不像jquery.ajax里還提供了async參數(shù)。1234567$http(method : POST,params : id:123, data:name:john,age:27, url : /mypath).success(function(response, status, headers, config)/do anything what you w