angularjs html事件(ng-click,ng-hide,ng-show)
ng-click:单击事件,
ng-hide:控制某款元素是否隐藏,true隐藏 false 显示
ng-show:控制某款元素是否显示,true显示 false 隐藏
可以参考页面:http://www.w3cschool.cc/angularjs/angularjs-html-events.html
个人源代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" ng-app=""> <head> <title>html事件</title> <script src="http://apps.bdimg.com/libs/angular.js/1.2.15/angular.min.js"></script> <script> function mycon($scope) { $scope.num = 0; $scope.fun = function() { $scope.num += 1; }; $scope.hide = false; $scope.toggle1 = function () { $scope.hide = !$scope.hide; }; $scope.show = true; $scope.toggle2 = function () { $scope.show = !$scope.show; }; } </script> </head> <body> <div ng-controller="mycon"> <h2>ng-click</h2> <input type="button" value="点击" ng-click="fun()"/> <p>{{num}}</p> <h2>ng-hide</h2> <input type="button" value="ng-hide" ng-click="toggle1()"/> <div ng-hide="hide"> <p >ng-hide交替可见性</p> <div style="width: 100px;height: 100px;background-color: #cccccc"></div> </div> <h2>ng-show</h2> <input type="button" value="ng-show" ng-click="toggle2()"/> <div ng-show="show"> <p >ng-hide交替可见性</p> <div style="width: 100px;height: 100px;background-color: #cccccc"></div> </div> </div> </body> </html>