Javascript AngularJS-ng在shell页面中单击

我有一个Angular JS应用程序，其中页眉和页脚是index.html的一部分，视图在这两个应用程序之间动态加载。我的控制器中的作用域上有一个

signOut（）

函数，可以正确调用REST API来注销用户。但是，“注销”按钮是标题的一部分，因此我很难让它调用

signOut（）

函数

ng click=“signOut（）”

标记内的

完全不起任何作用，可能是因为按钮位于shell页面中，而不是其中一个视图，因此无法访问范围

除了使用

ng click

，我还尝试在视图中放置一些代码，以便在单击按钮时调用

signOut（）

函数，因为我知道我可以通过DOM访问它。我第一次尝试这个：

<script>
    $('#logoutbutton').on('click', function(){
        {{signOut()}};
        console.log("signout clicked");
    });
</script>

即使尝试使用该代码会引发语法错误（

意外标记“{”

），也无法工作

我想知道，当单击注销按钮时，是否有任何方法可以调用signOut（）函数，而无需将按钮作为视图的一部分而不是shell页面。

出于好奇，我通过默认设置

display:none

，并将这一行放在所有视图的顶部来控制按钮是否可见：

<script>
document.getElementById('logoutbutton').style.display = 'block';
</script>

document.getElementById（'logoutbutton'）。style.display='block'；

这就是我知道我可以通过DOM访问按钮的原因，即使在视图中也是如此。

这对我很有用

<button id="btn">click</button>

$scope.show = function(){alert('msg');}
$('#btn').on('click',$scope.show);

点击
$scope.show=function（）{alert（'msg'）；}
$（'#btn'）。on（'click'，$scope.show）；

我必须同意Mostafa Talebi的观点，接受的答案是使用完全不同的框架，而不是基于AngularJS的答案。事实上，我发现您的plunkr存在的唯一问题是主div缺少ng控制器指令，该指令需要指向您的注销控制器。然后，您就可以连接一个ng以常规方式单击您的按钮以退出功能。这基本上是glendaviesnz建议的。这样您就不需要执行javascript get元素和事件侦听，而这实际上不是一种有角度的方式

除此之外，应避免在angular应用程序中使用jquery事件，因为它们实际上发生在angular视图之外，或者更准确地说发生在angular摘要周期之外。您可以在angular和$broadcast/$emit to broadcast事件中使用$on to列表

---

您的需求是一个具有身份验证的基本spa，Dan Wahlin的CustomerManager中有许多很好的例子，这些例子演示了如何以纯粹的角度实现您的需求。

试着说

$（“#logoutbutton”）。on（'click'，$scope.signOut）

。不知道你的意思。有两个代码段使用了这个。你能为此添加一个Plunk吗？你可以在你的索引页上放置一个控制器，例如。-你的注销（）然后可以在此控制器中定义函数，您的所有视图控制器都将成为此控制器的子控制器。五分钟的精简尝试；不一定有效，但如果您熟悉Angular，至少应该显示文件是如何组合在一起的。您不应该基于非框架给出建议。它是jQuery和绝对不是一个好的建议。这几乎是可行的。对我来说，将这一行放在控制器中会导致函数运行，而不是在单击按钮时运行，而是在每次初始化视图时运行。更新：上面的表单不起作用，但当我用调用$scope.show的匿名函数替换$scope.show时，它会按预期运行。

$scope.show=function（）{alert（'msg'）；}$（'#btn'）。在（'click'，function（）{$scope.show（）；}）；

<button id="btn">click</button>

$scope.show = function(){alert('msg');}
$('#btn').on('click',$scope.show);