首页 > 代码库 > angular中的ng-click指令案例
angular中的ng-click指令案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>入门</title> <script src="http://www.mamicode.com/node_modules/angular/angular.js"></script> <style> .bgc-red { background-color: red; } </style></head><body ng-app="s1.app"><button class="{{currentBtn == 1 ? ‘bgc-red‘:‘‘}}" ng-click="setCurrent(1)">按钮1</button><button class="{{currentBtn == 2 ? ‘bgc-red‘:‘‘}}" ng-click="setCurrent(2)">按钮2</button><button class="{{currentBtn == 3 ? ‘bgc-red‘:‘‘}}" ng-click="setCurrent(3)">按钮3</button><button class="{{currentBtn == 4 ? ‘bgc-red‘:‘‘}}" ng-click="setCurrent(4)">按钮4</button><script> // 1. 定义一个我们自己的模块， // 第一个参数是：模块名， // 第二个参数：所依赖的其他的模块的名字的数组 var app = angular.module(‘s1.app‘, []); // app.run是Angularjs版本的“入口函数”，我们的Angularjs框架加载完成之后，就会来执行这里的函数。 // 其中有一点需要注意：$rootScope是Angularjs提供的“数据对象”， // 我们操作这个数据对象，就可以把变化同步到DOM上 // 参数名是写死的，不要变。（Angularjs的回调函数的传参，很多地方是“只认名字，不认顺序”的） app.run(function ($rootScope) { $rootScope[‘msg‘] = ‘hello angular‘; $rootScope[‘cssClass‘] = ‘bgc-red‘; $rootScope[‘currentBtn‘] = 1; // 标识当前的按钮 $rootScope[‘setCurrent‘] = function (current) { // 当按钮被点击之后，调用，设置当前的按钮 $rootScope[‘currentBtn‘] = current; } })</script></body></html>
angular中的ng-click指令案例
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。