gpt4 book ai didi

javascript - ngRoute 找不到模板

转载 作者:行者123 更新时间:2023-11-28 06:01:39 26 4
gpt4 key购买 nike

我是 Angular 新手,很难让 ngRoute 获取我的模板文件。

这是我的index.html:

<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="app.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/main.css" />
</head>
<nav>
<div>
<ul>
<li><a href="#/home">home</a></li>
</ul>
</div>
</nav>

<body>
<div ng-view>
</div>
</body>


</html>

这是我的 app.js:

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

myApp.controller('MainCtrl', function($scope) {
$scope.message = 'Hello World';
});

myApp.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/home', {
templateUrl: 'pages/home.html',
controller: 'MainCtrl'
})
.otherwise({
redirectTo: '/home'
});
}]);

这是我的pages/home.html:

<div ng-controller="MainCtrl">
<p>Test</p>
<p>{{ message }}</p>
</div>

我可以看到它正在将 #/附加到根 url,所以也许这部分有效;但是,它似乎没有在“pages/home.html”处渲染模板。

我已经检查了 cdn url,以确保不存在任何版本不一致的情况,但情况似乎并非如此。

这几乎是我的第一个 Angular 项目,我刚刚离开文档,但一定有一些我没有看到的东西。来自其他服务器端项目,缺乏堆栈跟踪简直要了我的命,哈哈。

上面的代码中是否缺少某些内容,导致我的模板无法在“/”中呈现?

谢谢!

最佳答案

这是我的代码,它工作正常,您可以从中获取帮助。

var EventList = angular.module("EventList", ['ngRoute' ,'infinite-scroll']);
EventList.config(function($routeProvider) {
//$locationProvider.html5Mode(true);
$routeProvider
.when('/', {
templateUrl: 'views/business/business_home_events.html',
controller: 'EventListController'
});
});

EventList.controller('EventListController', ['$scope', '$http', '$route', function($scope, $http, $route){

// Do your work

}]);

关于javascript - ngRoute 找不到模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37222325/

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