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指令的资料整理,后续继续补充,谢谢大家对本站的支持!