angularjs下ng-repeat點擊元素改變樣式的實現方法

1.一個angularjs的學習，了解ng-class的使用技巧；

2.代碼：

html：

 <div ng-repeat='myimg in myimgs'>
 <img ng-src="{{myimg}}" ng-click="fabricChoose($index)" ng-class="{fabricImg1:$index==fabricIsSelected}">
 </div>

css：

.fabricImg1{
border:2px solid blue;
}

js：

$scope.fabricChoose = function(i){
 $scope.fabricIsSelected = i;
}

效果就是點擊選擇圖片 就出現藍色border。

3.分析

ng-class的使用技巧就是 ng-class='{name:istrue}' ,在css中寫.name的樣式 ，當istrue布爾值為true時，此元素就會添加.name的樣式，為false時，不增加這個樣式。

以上這篇angularjs下ng-repeat點擊元素改變樣式的實現方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com