Question

我到处寻找答案，但不幸的是我找不到任何东西。

我有一个工作的Angular应用程序，如下所示：

...
<div class="container" ng-app="myApp">
<div class="page-title">
    <h1>
    Hello
    </h1>
</div>

<div ng-view></div>

</div>
...

我正在使用ngRoute将html部分加载到ng-view div中。

我的JS：

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

myApp.config(['$routeProvider', '$httpProvider',
    function($routeProvider, $httpProvider) {
        $routeProvider.
                when('/step1', {
                    templateUrl: 'template1.html',
                    controller: 'Step1Controller'
                }).
                when('/step2', {
                    templateUrl: 'template2.html',
                    controller: 'Step2Controller'
                }).
                when('/step3', {
                    templateUrl: 'template3.html',
                    controller: 'Step3Controller'
                }).
                otherwise({
                    redirectTo: '/step1'
                });
      }]);

到此为止，一切都充满魅力。我已经完成了我需要的所有东西（多步向导）。

在最后一步，我需要使用<script type="text/ng-template" id="specialTemplate.html"></script>生成一些特殊模板（树）

所以，在我的最后一步页面部分（template3.html）中，我做了以下内容：

<ul>
    <li ng-repeat="item in [1,2,3]" ng-include="'specialTemplate.html'"></li>
</ul>


<script type="text/ng-template"  id="specialTemplate.html">
 Test
</script>

我卡在这里。我在控制台上遇到 404 错误（他试图在浏览器的url指向的同一目录中查找 specialTemplate.html ），并且模板未加载。< / p>

当我进行一些测试时，我看到如果ng-include在ng-view之外，但在与当前工作流程分开的干净ng-controller内，它确实找到并加载了模板，但这对我没有帮助，因为我必须在工作步骤流程中渲染树。

是否无法在<script>内加载基于ng-view的模板？

提前感谢您的帮助。

修改版本：AngularJS v1.3.0-beta.3

Answer 1

当您尝试从specialTemplate.html内抓取ngView时，它可能会更改ngInclude指向的网址。尝试将路径硬编码到specialTemplate.html。或者您可以尝试将script放在li内，因为它也可能是一个范围问题。

Answer 2

如果您在本地Windows系统中进行测试，则不会从http-server提供您的页面可能是问题。

作为修复，使用commnd：

全局安装http-server

npm install -g http-server

并记得在Linux系统中使用sudo。安装服务器后，使用以下命令启动服务器：

http-server

现在，转到浏览器中的http://127.0.0.1:8080/，然后导航到所需的页面。

在ng-view中使用ng-include 404问题

2 个答案: