javascript Angular:ng-click 和 <li> 项
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/29653348/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular: ng-click and <li> items
提问by serlingpa
I'm using the fabulous UI Bootstrapfor Angular but am having difficulty getting an onclick event raised.
我正在为 Angular使用出色的UI Bootstrap,但是我很难触发 onclick 事件。
Here is the code:
这是代码:
<ul class="dropdown-menu" role="menu">
<li><a><img src='/Content/Images/dept_cargo.png'/> CARGO</a></li>
<li><a><img src='/Content/Images/dept_commercial.png'/> COMMJ</a></li>
<li><a><img src='/Content/Images/dept_executive.png'/> EXECJ</a></li>
<li><a><img src='/Content/Images/dept_travel.png'/> TVL</a></li>
</ul>
{{ currentDepartment }}
I've tried every combination: putting the ng-click="behaviour()" variously inside the li, the a and the img, but nothing seems to work.
我尝试了所有组合:将 ng-click="behaviour()" 以不同的方式放在 li、a 和 img 中,但似乎没有任何效果。
What am I doing wrong?
我究竟做错了什么?
(ideally I'd just like to change the value of a scope variable but I'm thinking calling a behaviour to do the work is better practice)
(理想情况下,我只想更改范围变量的值,但我认为调用行为来完成工作是更好的做法)
This question is not the same as suggested above. The other question is to do with scope, whereas I would be happy just to be able to execute an alert(); from one of my li's.
这个问题与上面建议的不同。另一个问题与范围有关,而我很高兴能够执行 alert(); 来自我的一个 li。
采纳答案by reddiky
<ul class="dropdown-menu" role="menu">
<li><a ng-click="behaviour()"><img src='/Content/Images/dept_cargo.png'/> CARGO</a></li>
Make sure you have $scope.behaviour = function() {}
defined inside of the controller for that code snippet.
确保您已$scope.behaviour = function() {}
在控制器内部为该代码片段定义。
回答by Caner Akdeniz
You must have an issue in the js code where you set up the controller but if you set it up right, your html should look like this:
您在设置控制器的 js 代码中肯定有问题,但如果设置正确,您的 html 应如下所示:
<ul class="dropdown-menu" role="menu">
<li ng-click="behaviour()"><a><img src='/Content/Images/dept_cargo.png'/> CARGO</a>
</li>
<li ng-click="behaviour()"><a><img src='/Content/Images/dept_commercial.png'/> COMMJ</a>
</li>
<li ng-click="behaviour()"><a><img src='/Content/Images/dept_executive.png'/> EXECJ</a>
</li>
<li ng-click="behaviour()"><a><img src='/Content/Images/dept_travel.png'/> TVL</a>
</li>
</ul>
and in your js:
在你的 js 中:
function myCtrl($scope) {
$scope.behaviour = function () {
alert('asd');
};
}
and here is a working sample: http://jsfiddle.net/97u2jp6d/1/
这是一个工作示例:http: //jsfiddle.net/97u2jp6d/1/
回答by tpie
You don't need more than this:
您不需要更多:
HTML
HTML
<ul>
<li ng-click="doSomething()">item 1</li>
<li ng-click="doSomething()">item 2</li>
<li ng-click="doSomething()">item 3</li>
<li ng-click="doSomething()">item 4</li>
<li ng-click="doSomething()">item 5</li>
</ul>
Controller
控制器
$scope.doSomething = function () {
console.log('doing something');
}