Share.. Ask.. Learn..
Pages
Home
AngularJs Keywords
AngularJS
AngularJS Question & Answer
Angular 2
About Us
Contact Us
Thursday, 12 November 2015
ng-class-odd
What is ng-class-odd:
ng-class--odd used to apply a dynamic class, on odd element in ng-repeat ..
Description of ng-class-odd:
Basically ng-class-odd is a extended/enhanced form of ng-class. limitations with ng-class-odd is that it can be used within ng-repeat directive. it has 0 priority..
Syntax of ng-class-odd:
.
<
element
ng-repeat
="obj in list">
<
element
ng-class-odd
="'classname'"></
element
>
</
element
>
OR
<
table
ng-repeat
="obj in list">
<
tr
>
<
td
ng-class-odd
="'bggreen'"></
td
>
</
tr
>
</
table
>
How to Use ng-class-odd/ng-class-odd Example::
Example
<
div
ng-app
="webapp">
<
div
ng-controller
="angularjsexampleCtlr">
<
div
>
Angularjs Example of ng-class-odd
<
br
/>
<
table
>
<
thead
>
<
tr
>
<
th
>
S.No.
</
th
>
<
th
>
Name
</
th
>
<
th
>
Address
</
th
>
</
tr
>
</
thead
>
<
tbody
>
<
tr
data-ng-repeat
="obj in list">
<
td
>
{{
$index+1
}}
</
td
>
<
td
ng-class-odd
="'success'">
{{
obj.name
}}
</
td
>
<
td
>
{{
TextContentObj.address
}}
</
td
>
</
tr
>
</
tbody
>
</
table
>
</
div
>
</
div
>
</
div
>
<
script
>
angular.module(
'webapp'
, []).controller(
'angularjsexampleCtlr'
,
function
($scope, $http) {
$scope.list = [{ name:
'abc'
, address:
'Delhi'
}, { name:
'pqr'
, address:
'Kolkata'
}, { name:
'xyz'
, address:
'Mumbai'
},{name:
'lmn'
,address:
'Chennai'
}];
});
</
script
>
No comments :
Post a Comment
Newer Post
Older Post
Home
Subscribe to:
Post Comments ( Atom )
No comments :
Post a Comment