使用 ng-view 加载页面不起作用[重复]答案

【问题标题】：Loading pages using ng-view does not work [duplicate]使用 ng-view 加载页面不起作用[重复]
【发布时间】：2018-09-27 22:11:58
【问题描述】：

我正在使用 Brackets 编辑器开发我的第一个 AngularJS 路由器，以便我在本地主机上对其进行测试（我知道它不会在我的本地机器上工作）。包含文件工作正常，但它不会加载所有 5 个 HTML 文件。请查看Plunker 上的所有代码。我不明白缺少什么。

HTML

<head>
<title>Welcome!</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script>
<script src="script.js"></script>
</head>

<body ng-app="myApp">

<!-- header section -->
<div ng-include="'header.html'"></div>

<br><br>

<!-- views section -->
<div ng-view>View pages here...</div>

<br><br>

<!-- footer section -->
<div ng-include="'footer.html'"></div>

</body>

script.js

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

.config(function($routeProvider) {
$routeProvider.when('/1', {
    templateUrl: '1.html'
})
$routeProvider.when('/2', {
   templateUrl: '2.html'
})
$routeProvider.when('/3', {
    templateUrl: '3.html'
})
$routeProvider.when('/4', {
   templateUrl: '4.html'
})
$routeProvider.when('/5', {
    templateUrl: '5.html'
})
});

【问题讨论】：

问题显示 AngularJS V1.6，但 PLNKR 使用 V1.2。这是 V1.6 问题还是 V1.2 问题？这很重要，因为默认的 hashbang 前缀在两个版本之间发生了变化。

标签： angularjs ngroute ng-view angularjs-1.6

【解决方案1】：

只需将href="#/1" 更改为href="#!1"

<div>
    <a href="#!1">One</a>
    <a href="#!2">Two</a>
    <a href="#!3">Three</a>
    <a href="#!4">Four</a>
    <a href="#!5">Five</a>
</div>

【讨论】：

是的，这行得通，但它很奇怪。它适用于 plnkr.co/edit/f09xYs24HThNT3Nfntp4?p=preview> 没有 !。
V1.6 更改了默认的哈希爆炸前缀。如需更多信息，请参阅AngularJS Developer Guide - Migrating to V1.6 - $location。
是的，我正要发表评论，在第一个 plunker 中你有 1.6.4，现在你改为 1.2.3
是的，我改回来它可以在 Plunker 上运行，但我的实际项目仍然显示空白页。