AngularJS教程 ng-style 指令简单示例
AngularJSng-style指令
AngularJS实例
使用AngularJS添加样式,使用CSSkey=>value对象格式:
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<scriptsrc="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<bodyng-app="myApp"ng-controller="myCtrl">
<h1ng-style="myObj">菜鸟教程</h1>
<script>
varapp=angular.module("myApp",[]);
app.controller("myCtrl",function($scope){
$scope.myObj={
"color":"white",
"background-color":"coral",
"font-size":"60px",
"padding":"50px"
}
});
</script>
</body>
</html>
定义和用法
ng-style指令为HTML元素添加style属性。
ng-style属性值必须是对象,表达式返回的也是对象。
对象由CSS属性和值注册,即key=>value对。
语法
<elementng-style="expression"></element>
所有的HTML元素都支持该属性。
参数值
 
值 
描述 
 
string 
表达式返回由CSS属性和值组成的对象。 
以上就是对AngularJSng-style指令的资料整理,后续继续补充,谢谢大家对本站的支持!