gpt4 book ai didi

Angular 路由器中的 Javascript

转载 作者:行者123 更新时间:2023-11-29 19:10:33 24 4
gpt4 key购买 nike

我构建了一个非常基本的 Angular Router。但是现在我想与该 templateUrl 中的元素进行交互,不会执行任何 javascript,或者无法访问 templateUrl 中的那些元素。我已经从这条指令中复制了大部分代码,here .

我的索引文件:

<html ng-app="myApp">

<head></head>

<body ng-controller="mainController">

<a id="btnHome" href="#/">Startseite</a>
<a id="btnPlanner" href="#/planner">LTC-Planner</a>
<a id="btnSocial" href="#/social">LTC-Social</a>

<div id="main">
<!-- angular content -->
<div ng-view></div>
</div>

<script src="js/routing.js"></script>
</body>

</html>

这是我的 routing.js 文件:

// Create the angular module
var myApp = angular.module('myApp', ['ngRoute']);

// Configure our routes
myApp.config(function($routeProvider) {
$routeProvider

// Route for the home page
.when('/', {
templateUrl: 'pages/home.html',
controller: 'mainController'
});
});

// Create the controller and inject angular's $scope
myApp.controller('mainController', function($scope) {
$scope.message = 'This is the HOME page';
});

这是位于pages/home.html 的模板文件:

<button id="btnTest">Say Hello</button>

<script>
var btnTest = document.getElementById('btnTest');

btnTest.addEventListener('click', function(){
console.log('Hello');
});
</script>

也许你们中的一个人有想法或已经看到了替代方案。

谢谢,安德烈

最佳答案

你应该尝试将你的 html 模板包装在一个标签中

<div>
<button ng-click="test()">Say Hello</button>
</div>

并删除脚本以将逻辑放入您的 Controller 中。由于您使用的是 Angular ,只需使用 ng-click 来绑定(bind)点击监听器。

myApp.controller('mainController', function($scope) {
$scope.message = 'This is the HOME page';
$scope.test = function() {
console.log('Hello');
}
});

关于Angular 路由器中的 Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39192676/

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