gpt4 book ai didi

javascript - 从 head 中的纯 JavaScript 调用 Angular 函数

转载 作者:行者123 更新时间:2023-11-28 19:33:58 27 4
gpt4 key购买 nike

这是一个结构不良的问题,但我还没有足够的知识来阐明它。我还继承了一个困惑的项目,所以我无法给出太多示例代码。我在 Controller testCtrl 中定义了一个函数 $scope.$back,该函数存在于 angular.module('messyApp') 中。这是在一个单独的 js 页面 main.js 上。

当我在加载 Angular 内容后触发 onkeydown 事件时,我想从 header 中的纯 JavaScript 脚本调用此函数。我有一个想法,我需要在之后调用 Angulars $apply 函数,但我无法弄清楚如何访问这些函数中的任何一个,因为我收到错误它们未定义。

我使用 $routeProvider 来指定 testCtrl Controller 。这是一些可能有用的代码;

<html>
<head>

...loads of scripts and stuff...

<script type="text/javascript">
function keyFunc(e) {

switch (e.keyCode) {
case 37:
console.log('left');
break;
case 38:
console.log('up');
break;
case 39:
console.log('right');
break;
case 40:
console.log('down');
break;
}

$rootScope.$next(); // angular function im trying to trigger
}
</script>
</head>
<body ng-app="messyApp" onkeydown="keyFunc(event)">

...tons more scripts...

</body>
</html>

Angular 函数 $back() 使用

在页面其他位置的超链接上触发
<a ng-click="$back()"><div class="icon" id="backicon"><img src="back.png" /></div></a>

所以,如果确实如此,我可以接受一个甚至的js触发此超链接的黑客解决方案(我认为这会触发 Angular )。

最佳答案

如果您尝试访问 $rootScope 上定义的函数,您必须在 html 中使用 $root. 正确引用它。例如:<a ng-click="$root.$back()"></a>

但是还有许多其他问题。我真的建议使用 ui-router 和基于状态的导航,因为它会让你的生活更轻松。此外,尽可能避免使用 $rootScope。对于绑定(bind)到键,最佳实践是使用 Angular Directive(指令)。例如,如果您想绑定(bind)到 Enter 键,您的代码在指令的链接函数中将如下所示:

element.bind("keydown keypress", function (event) {
if(event.which === 13) {
doSomething();
}
}

关于javascript - 从 head 中的纯 JavaScript 调用 Angular 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26240765/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com