AngularJS错误：[$compile：tpload]无法加载模板。

Question

我正在尝试在AngularJS中构建一个简单的路由应用程序。我有一个主index.html页面，其中包含ng-view div和用于路由的javascript代码。还有两个简单的html页面view2.html和view3.html，放置在子文件夹partials1中。

我遇到了下面的错误，请帮忙解决。

Error: Access is denied. Error: [$compile:tpload] Failed to load template: partials1/view3.html http://errors.angularjs.org/1.3.15/$compile/tpload?p0=partials1%2Fview3.html

• index.html：

  
  

<div data-ng-view></div>

<script src="angular.js"></script>
<script src="angular-route.js"></script>
<script type="text/javascript">
    var demoApp = angular.module('demoApp', [ 'ngRoute' ]);
    demoApp.controller('SimpleController', function($scope) {
        $scope.customers = [ {
            name : 'Jon Smith1',
            city : 'Charlotte'
        }, {
            name : 'John Doe',
            city : 'New York'
        }, {
            name : 'Jane Doe',
            city : 'Jacksonville'
        } ];
    });

    demoApp.config([ '$routeProvider', function($routeProvider) {
        $routeProvider.when('/view1', {
            templateUrl : 'partials1/view3.html',
            controller : 'SimpleController'
        }).when('/view2', {
            templateUrl : 'partials1/view2.html',
            controller : 'SimpleController'
        }).otherwise({
            redirectTo : '/view1'
        });
    } ]);
</script>

view2.html

<div class="container">33333333333333</div>

view3.html

<div class="container">33333333333333</div>

- Santo

---

我会问一个显而易见的问题：您在'partials1'文件夹及其后续的'view3.html'上是否拥有正确的权限？ - SamHuckaby

Answer 1

Error: Access is denied表示模板无法访问。请尝试在浏览器中打开模板，例如：http://my_project/partials1/view3.html。要查看应用程序使用的完整URL，请使用调试控制台（XHR选项卡）。

- Konstantin Kamkou

---

我在开头漏掉了一个正斜杠：正确的写法是 templateUrl : '/partials1/view3.html', 希望能帮到有需要的人。 - Shaiju T

Answer 2

Error: [$compile:tpload] Failed to load template: xyz.html (HTTP status: 404 Not Found)

可以由web.config中的以下设置引起。

 <system.webServer>
    <handlers>
      <remove name="BlockViewHandler"/>
      <add name="BlockViewHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.HttpNotFoundHandler" />

这会阻止直接请求Views目录中的文件。Angular xhr请求将被此项阻止。

将其注释掉，看看是否有效。请谨慎使用，因为它允许访问您的文件。

您也可以在此URL上查看更多响应：错误：$compile：tpload无法加载模板Http状态：404。

- Ashish

Answer 3

我遇到了同样的错误，在我的情况下，Web服务器是使用Node.js编写的，并且使用$stateProvider指定路径获取视图的URI未被创建，因为对于要显示的每个视图/模板都会发出类型为Xhr GET的HTTP请求。

由于URI不存在，我获得了404代码，这使浏览器进入回调并将其杀死。确保您的服务器返回所请求的视图。

- learango

Answer 4

在我的情况下，问题是我添加了默认标头，例如Accept = 'application/json'。因此，我的路由突然停止工作，因为这些标头不仅适用于我的$http.post调用，而且也适用于我的Routing...？奇怪。

- Suamere