angular动态设置css,在角度JS中动态应用CSS样式属性

ngStyle directive allows you to set CSS style on an HTML element dynamically.

Expression which evals to an object whose keys are CSS style names and values are corresponding values for those CSS keys. Since some CSS style names are not valid keys for an object, they must be quoted.

ng-style="{color: myColor}"

Your code will be:

If you want to use scope variables:

Here an example on fiddle that use ngStyle, and below the code with the running snippet:

angular.module('myApp', [])

.controller('MyCtrl', function($scope) {

$scope.items = [{

name: 'Misko',

title: 'Angular creator'

}, {

name: 'Igor',

title: 'Meetup master'

}, {

name: 'Vojta',

title: 'All-around superhero'

}

];

});

.pending-delete {

background-color: pink

}

name: {{item.name}}, {{item.title}}

(will be deleted)

I will hide if the color is set to 'red'.