ng-view将不会显示模板

问题描述：

我一直在Angular上工作，我试图实现简单的路由。我有一个基本的HTML，其中包含对所有必需脚本和ng-view标记的引用。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'}) 
});

什么是开发者控制台说？任何错误/警告？ –

以下错误：“加载模板失败”。 –

然后问题是你提供了一个错误的HTML文件路径。你的routView1.html在哪里？你的文件夹结构是什么样的？ –

答

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

然后，你将需要从改变你的templateUrl路径：

{templateUrl : '/routView1.html'}

到：

答

您需要重定向到该页面，这样路由会知道里面ng-view指令来呈现的页面。

有多种方式可以做到这一点。

定义一个否则重定向到/。

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

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

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

默认网页在<head>标签页上。
```
<base href="/"/> 
```

感谢您的答案，没有任何选项帮助。我确实看到添加“否则”之后执行的路由，但ng-view不加载模板。按照上面问到的控制台，我看到以下错误： “无法加载模板”。我认为问题在于文件存储在本地并导致安全问题 - 我将启动服务器并查看是否得到不同的结果。 –

您需要在服务器上托管您的代码..其他模板将不会运行.. –

答

启动本地主机和从那里败坏了代码后，它的工作完美的罚款。

问题出在与本地ajax调用相关的安全性。

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

1.停用网络安全的铬。 2.启动本地主机进行测试。

ng-view将不会显示模板

相关推荐