ng-class、ng-style、ng-href、ng-attr-title

本文主要是介绍ng-class、ng-style、ng-href、ng-attr-title，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在angularjs中，设置样式：

   <style>.red{background: red;}.yellow{background: yellow;}div a {text-decoration: none;}</style><script src="js/angular.min.js"></script><script>var app = angular.module("myApp",[]);app.controller("myCtrl", function($scope){$scope.text = "hello";$scope.sClass = "{red:true}";//$scope.url = "http://www.baidu.com";$scope.url = "http://www.baidu.com";})</script>

<div ng-controller="myCtrl"><div ng-class="{{sClass}}">{{text}}</div><div ng-class="{red:true,yellow:true}">{{text}}</div><div ng-style="{background:'red',color:'white'}">{{text}}</div><div><a ng-href="{{url}}">aaaaa</a><br/><a ng-attr-href="{{url}}" ng-attr-title="{{text}}" ng-attr-class="" ng-attr-style="">aaaaa</a></div></div>

样式如下：

点击aaa，可链接到百度；把鼠标箭头放到第二个aaa上，会出现标题“hello”；

注意：在angular中用ng-class设置内部样式时，样式格式为：  如：ng-class="{red:true}",后面有个true；

外部样式与class类似；

用ng-style设置样式时，与style没什么大的区别

这篇关于ng-class、ng-style、ng-href、ng-attr-title的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---