AngularJS ng-style 指令
AngularJS 實例
使用AngularJS添加樣式，使用CSS key=>value 對象格式:
< body ng-app= "myApp" ng-controller= "myCtrl" >
< h1 ng-style= "myObj" >本教程< /h1 >
< script >
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.myObj = {
"color" : "white",
"background-color" : "coral",
"font-size" : "60px",
"padding" : "50px"
}
});
< /script >
< /body >
< h1 ng-style= "myObj" >本教程< /h1 >
< script >
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.myObj = {
"color" : "white",
"background-color" : "coral",
"font-size" : "60px",
"padding" : "50px"
}
});
< /script >
< /body >
嘗試一下»
定義和用法
ng-style指令為HTML元素添加style屬性。
ng-style屬性值必須是對象，表達式返回的也是對象。
對象由CSS 屬性和值註冊，即key=>value 對。
語法
< element ng-style= " expression " > < / element >
所有的HTML 元素都支持該屬性。
參數值
| 值 | 描述 |
|---|---|
| string | 表達式返回由CSS 屬性和值組成的對象。 |