Angular-Foundation 和 ng-click 不适用于 <a> 标签答案

【问题标题】：Angular-Foundation and ng-click not working on <a> tagAngular-Foundation 和 ng-click 不适用于 <a> 标签
【发布时间】：2023-03-12 16:50:01
【问题描述】：

花了一整天的时间试图解决这个简单的问题，但没有运气。我将 ng-click 添加到标签，但它没有调用该函数。如果我将 ng-click 放在一个按钮上，它会起作用。

我尝试了以下但没有成功。

<li><a href="#" ng-click="signout()">Sign Out</a></li>
<li><a href="" ng-click="signout()">Sign Out</a></li>
<li><a href ng-click="signout()">Sign Out</a></li>
<li><a ng-click="signout()">Sign Out</a></li>
<li ng-click="signout()"><a href="#">Sign Out</a></li>

我注意到，当我点击它时，它会添加类 ng-click-active

喜欢这个

<a href="#" ng-click="signout()" class="ng-click-active">Sign Out</a>

或者像这样

<li ng-click="signout()" class="ng-click-active"><a href="#">Sign Out</a></li>

我还注意到，如果我在 chrome 开发工具控制台中执行此操作，ng-click on 标记将起作用

$(document).foundation();

我没有想法！

更新：我正在为注销功能添加 js

angular.module('myapp')
    .controller('NavbarCtrl', function ($scope, $state, principal) {

    $scope.signout = function() {
        console.log('*******************');
        principal.authenticate(null);
        $state.go('login');
    };

});

【问题讨论】：

你试过these ideas吗？
这是js，很简单-pastebin.com/2HunhN8E
sfletche，我现在看看链接
哦@sfletche，这就是我今天没有走运的人。如果您查看我上面的代码，我会按照该链接上的建议进行操作。就像我说的，如果它不在列表中，它可以工作。
你能创建一个基本的 plunkr。它会提供更好的画面。

标签： angularjs zurb-foundation angularjs-ng-click angular-foundation

【解决方案1】：

确保在 HTML 中包含 ng-app 和 ng-controller 指令，如下所示：

<!-- Reference ng-app -->
<html ng-app="myApp">

  <head>
    <script data-require="angular.js@1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
  </head>

  <!-- Reference ng-controller -->
  <body ng-controller="mainCtrl">
    <h1>ng-click</h1>

    <a href="#" ng-click="signout()">Sign Out</a>
  </body>

</html>

然后确保在控制器上添加对 $signout 函数的引用。

var app = angular.module('myApp', []); 

app.controller('mainCtrl', function($scope){
    $scope.signout = function(){
      alert("You clicked Sign Out"); 
    }
  });

这是一个指向 Plunker 的链接，它展示了如何在标签上实现 ng-click。

http://plnkr.co/edit/NrF6ay06mG7lJ5OvRP3F?p=preview

【讨论】：

杰克，我不想这么说，但看起来你没有好好阅读我的帖子。
我提供的示例展示了如何在标签上添加 ng-click。它不起作用的唯一原因是如果您没有定义 ng-app 指令、ng-controller 指令或范围内的函数。
我在上面写了这个 -> “如果我把 ng-click 放在一个按钮上，它就可以工作。”

【解决方案2】：

如果您不需要 url，请使用“button”或“div”标签而不是“a”标签。

<li><button ng-click="signout()">Sign Out</button></li>
<li><div ng-click="signout()">Sign Out</div></li>

【讨论】：