轉載地址：http://www.cnblogs.com/liulangmao/p/3718968.html
本篇主要介紹通過數據綁定來給元素添加特定的類名,從而應用特定的樣式
從一個最基本的例子來看:
<!DOCTYPE html> <html ng-app> <head> <title>6.1css類和樣式</title> <meta charset="utf-8"> <script src="../angular.js"></script> <script src="script.js"></script> <style type="text/css"> .submit-false { background:#efefef; color:#ccc } button { border:1px solid #ccc; outline:0 } </style> </head> <body> <div ng-controller="ButtonDisable"> <button class="submit-{{disable}}" ng-click="deActive()">提交</button> </div> </body> </html>
一個提交的按鈕,點擊以後就會被禁用,顯示爲灰色:
給button添加類名submit-{{disable}},這樣,disable的改變,就會引起button類名的改變,
當disable變量值爲false時,就會拼接成submit-false類名,運用相對應的樣式
function ButtonDisable ($scope){ $scope.disable = true; $scope.deActive = function(){ $scope.disable = false } }
原始狀態:
點擊一次以後:
