我正在使用AngularJS和ui-router。我有一个子菜单,当用户点击他们的用户名时会打开它,在其中我想要一个注销按钮。它是一个带有ng-click的div,应该注销用户; 然而,ng-click从未触发。
这一部分只是显示/隐藏子菜单。
用户子菜单的CSS样式,唯一不同的地方。
所有这些标记都包裹在
这一部分只是显示/隐藏子菜单。
<div class="user-view-content" ng-init="showSubMenu = false" ng-click="showSubMenu = !showSubMenu">
{{getUsername()}}
<span class="glyphicon glyphicon-chevron-down"></span>
</div>
子菜单的内容为 - ng-click 失败!
<div class="user-sub-menu" ng-show="showSubMenu">
<div ng-click="logout()">Logout</div>
</div>
奇怪的是,如果我将它移出子菜单,它就可以正常工作。 ng-click成功
<div ng-click="logout()">Logout</div>
用户子菜单的CSS样式,唯一不同的地方。
.user-sub-menu {
position: fixed;
border-radius: 6px;
border: solid 1px #f3fcff;
padding: 1em;
top: 51px;
right: 4px;
}
所有这些标记都包裹在
<div ui-view="user" class="user-view"></div>
内部,本身嵌套了约5-6个不同的ui-views。这是该应用程序中我遇到ng-click未触发的唯一情况。由于牵涉到的复杂性,我无法在jsfiddle中重现。
- 为什么我的ng-click没有触发?
更新1
如iH8下面建议的那样,可能是孤立作用域问题(这毫无道理,但无论如何都尝试了)。下面的代码不会触发也不会使{{testVal}}变为“after”。它始终保持为“before”。
<div class="user-sub-menu" ng-show="showSubMenu" ng-init="testVal='before'">
<div ng-click="testVal='after'">Logout</div>
{{testVal}}
</div>