效果如下图，当分别点击1,2，3时，下面的不同颜色的div会切换
<html ng-app> <head> <title></title> <script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script> <style type="text/css"> *{ margin:0; padding: 0; } ul{ height: 30px; } ul li{ width: 198px; height: 30px; border: 1px solid #ccc; background: #fff; color:#000; float: left; list-style: none; text-align: center; } .clicked{ background: #000; color:#fff; } .div1,.div2,.div3{ width: 600px; height: 400px; } .div1{ background: red; } .div2{ background: green; } .div3{ background: yellow; } </style> </head> <body> <ul ng-init="a=1"> <li ng-click="a=1" ng-class="{clicked:a===1}">1</li> <li ng-click="a=2" ng-class="{clicked:a===2}">2</li> <li ng-click="a=3" ng-class="{clicked:a===3}">3</li> </ul> <div ng-switch on="a"> <div ng-switch-when="1" class='div1'></div> <div ng-switch-when="2" class='div2'></div> <div ng-switch-when="3" class='div3'></div> </div> </body> </html>