-----index.html-------
<html>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-
route.js"></script>
<script src="main.js"></script>
<script src="aboutController.js"></script>
<div ng-app="myApp" ng-controller="aboutController">
<h1>About Page</h1>
<p>{{ message }}</p>
<button ng-click="go()">Submit</button>
<div ng-view></div>
</div>
</html>
----main.js--------
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
$routeProvider
.when("/go", {
templateUrl : "sample.html"
});
});
----aboutController.js---------
var app = angular.module("myApp", []);
app.controller('aboutController', function($scope,$http,$location) {
$scope.name="";
$scope.message="Home Page";
$scope.go= function(){
$http.get('content.json').success(function(data) {
$scope.obj = data;
$location.path("/go");
});
}
});
------sample.html--------
<h1>Sample Page</h1>
我正在尝试在此测试应用程序中使用 Angular 路由。你能告诉我我在这里做错了什么吗?当我单击提交按钮时,地址栏中的位置更改为“http://localhost:8080/index.html#/go ”,但我在 ng-view 中看不到“sample.html”的内容。
最佳答案
您为应用程序声明了两次模块,因此它会覆盖第一个配置。删除第二个声明: var app = angular.module("myApp", []);
这是您的代码(出于演示目的,我删除了 GET 请求并用模板替换了模板 url):
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
$routeProvider
.when("/go", {
template: "<h1>Sample Page</h1>"
});
});
app.controller('aboutController', function($scope, $http, $location) {
$scope.name = "";
$scope.message = "Home Page";
$scope.go = function() {
$location.path("/go");
}
});
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-
route.js"></script>
<script src="main.js"></script>
<script src="aboutController.js"></script>
<div ng-app="myApp" ng-controller="aboutController">
<h1>About Page</h1>
<p>{{ message }}</p>
<button ng-click="go()">Submit</button>
<div ng-view></div>
</div>
</html>
关于javascript - ng-view无法显示数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43416550/