Question

我一直在使用Angular，我试图实现简单的路由。我有一个基本的HTML，其中包含对所有必需脚本和ng-view标记的引用。

出于某种原因，加载页面时，模板不会显示在ng-view位置。为什么不显示，以及如何修复它？

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-route.js"></script>
    <script src="routCtrl.js"></script>
</head>
<body ng-app='ngRouteTest'>
    <div ng-view></div>
</body>

和脚本文件：

var ngRouteTest = angular.module('ngRouteTest',['ngRoute']);
ngRouteTest.config(function($routeProvider){
    $routeProvider
.when('/', 
     {templateUrl : '/routView1.html'})
});

Answer 1

您需要重定向到该页面，以便路由将知道要在ng-view指令中呈现哪个页面。

有多种方法可以做到。

另外定义一个以重定向到/。

$routeProvider.otherwise({redirectTo: '/'})

将锚点添加到将重定向到/的页面。

<body ng-app='ngRouteTest'>
    <a href="#/">Home Page</a>
    <div ng-view></div>
</body>

在<head>代码的页面上设置了默认网址。
```
<base href="/"/>
```

Answer 2

启动本地主机并破坏代码后，它工作得非常好。

当您进行本地ajax调用时，问题在于与Chrome相关的安全性。

所以有一个问题应该做以下事情之一：

1. Chrome中的禁用网络安全性。 2.启动本地主机进行测试。

Answer 3

好的，首先你需要从服务器运行你的代码，所以要在本地测试它，使用http-server这很容易准备。

然后，您需要更改templateUrl路径：

{templateUrl : '/routView1.html'}

为：

{templateUrl : './routView1.html'}

ng-view不会显示模板

3 个答案: