web-dev-qa-db-ja.com

angularjsエラー：[$ compile：tpload]テンプレートのロードに失敗しました

Angularjsで簡単なルーティングアプリを構築しようとしています。メインのindex.htmlページには、ng-view divとルーティング用のJavaScriptコードが含まれています。また、サブフォルダーpartials1に配置された2つのシンプルなHTMLページview2.htmlおよびview3.html。エラーが発生しています。助けてください。

エラー：アクセスが拒否されました。エラー：[$ compile：tpload]テンプレートのロードに失敗しました：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>
javascripthtmlangularjsangularjs-routing
7
Santo

Error: Access is deniedは、テンプレートにアクセスできないことを示します。ブラウザでテンプレートを開いてみてください。このようなもの： http：//my_project/partials1/view3.html 。アプリで使用されている完全なURLを確認するには、dubugコンソール（XHRタブ）を使用します。

4
Kanstantsin Kamkou
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

1
Ashish

私の場合、問題はAccept = 'application/json'などのデフォルトヘッダーを追加したことです。これらのヘッダーは$ http.post呼び出しに適用されるだけでなく、ルーティングにも適用されるため、ルートが突然機能しなくなりました...？奇妙な。

0
Suamere

私の場合、Webサーバーはノードjsで記述され、$ stateProviderで指定されたパスにあるビューを取得するためのuriは作成されませんでした。タイプXhr GETが作成されます。

URIが存在しなかったため、404コードを取得しました。これにより、ブラウザがコールバックになり、彼が殺されました。サーバーが要求されたビューを返していることを確認してください。 （グーグル翻訳で翻訳）

0
learango