我刚开始使用 AngularJS。当我尝试实现以下示例时,我得到了
404 Not Found
这是我的 main.html
<!DOCTYPE html>
<html ng-app="demoApp">
<script src="angular.min.js"></script>
<head>
<title>main page</title>
</head>
<body>
<div ng-view></div>
<script>
var demo = angular.module('demoApp',[]);
demo.config(function ($routeProvider){
$routeProvider
.when ('foo',{
controller : 'SimpleController',
templateUrl: 'first.html'
})
});
demo.controller('SimpleController',function($scope){
$scope.customers = [
{name: 'sac',city:'abcd'},
{name: 'mac',city:'efgh'},
{name: 'nalaka',city:'ijkl'}
];
});
</script>
</body>
</html>
我的第一个.html
<ul>
<li ng-repeat="cus in customers ">{{ cus.name }}</li>
</ul>
当我访问 localhost/foo
时,出现 404 异常。我刚开始使用 AngularJS。所以解决这个问题的任何帮助/指南对我来说都是一个很大的帮助。
提前致谢
最佳答案
您应该在页面上引用 angular-route.min.js
文件,然后在您的应用程序中包含 ngRoute
模块。
var demo = angular.module('demoApp',['ngRoute']);
您应该将您的.when
条件更正为以下
.when('/foo',
由于您没有在路由中启用 html5mode
,您可以通过 localhost/#/foo
URL 访问该页面。
var demo = angular.module('demoApp', ['ngRoute']);
demo.config(function($routeProvider) {
$routeProvider
.when('/foo', {
controller: 'SimpleController',
templateUrl: 'first.html'
})
// By default it will open foo
.otherwise({redirectTo: '/foo'})
});
demo.controller('SimpleController', function($scope) {
$scope.customers = [{
name: 'sac',
city: 'abcd'
},
{
name: 'mac',
city: 'efgh'
},
{
name: 'nalaka',
city: 'ijkl'
}
];
});
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-route.min.js"></script>
<div ng-app="demoApp">
<div ng-view></div>
<script type="text/ng-template" id="first.html">
Content of the template.
</script>
</div>
关于javascript - 在 AngularJS 中找不到 404,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42319670/