2017-08-28 34 views
0

私の頭をこれに対して数時間ずっと叩いてしまったので、私はアイデアがありません。私は角度をつけて新しく、ハンドルを得るために非常に基本的なアプリケーションを構築しようとしています。次のように角度ルーティング、templateUrlはhtmlファイルを見つけることができません

出願の関連部分は、次のとおり

main.htmlを

<!doctype html> 
<html> 
    <head> 
     <link href="css/main.css" rel="stylesheet" type="text/css"></link> 
     <link href="https://fonts.googleapis.com/css?family=Comfortaa" rel="stylesheet"> 
    </head> 
    <body ng-app="weatherApp"> 
     <div class="main"> 
      <div class="navbar"> 
       <div class="vCentered"> 
        <img src="assets/logo.png" id="logo"> 
       </div> 
      </div> 
      <div ng-view> 
      </div> 
     </div> 
    </body> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script> 

    <script src="js/app.js"></script> 


</html> 

app.js

var app = angular.module("weatherApp", ["ngRoute"]); 

app.config(function($routeProvider) 
      { 
    $routeProvider 
    .when('/', { 
    templateUrl: "home.html"; 
    }) 
    .otherwise({ 
    redirectTo: '/' 
    }); 
}); 

home.html

<h1>Hello.</h1> 

非常に基本的です。問題は、main.htmlが読み込まれたときに、home.htmlの内容を表示することができないということです。

$routeProvider 
    .when('/', { 
    template: "Hello."; 
    }) 

だから、実際にhome.htmlを見つけるtemplateUrlでの問題のいくつかの種類のように見える:私はapp.jsに次のコードを使用した場合、コンテンツ表示しないことに注意してください。

私はどこにでもhome.htmlを入れました。それは今、私のPC全体に散りばめられています。それは、templateUrlがそこで狩りをしているチャンスではありますが、負荷がかかることは今のところありません。

自分のマシンでインターネットインフォメーションサービスを有効にして、プロジェクトをinetpub/wwwrootフォルダに入れてみましたが、それは役に立たなかった。 (Windows 10を実行中)

私が間違っていることについてのアイデアは非常に高く評価されます。

+0

index.htmlとhome.htmlの両方が同じ場所にあることを明確にするには?もしもあなたがこのスクリプトをスキップしたいのなら、 '' –

+0

main.htmlとhome.htmlは同じ場所にあります。 今後の使用のために問題を解決する方法を工夫することをお勧めします:) – EmmaO91

+0

私はindex.htmlがプロジェクトのルートにあると仮定していますので、実行する必要があるのはapp.jsをindexと同じパスに配置することです.htmlと変更 '' –

答えて

1

テンプレートのURLが

templateUrl: "../project%20name/home.html" 

に設定する必要がありました。またそれは別の時点で私を倒してしまったとして、ブラウザのlocalhost/main.htmlを経由プロジェクトにアクセスすることを確認してください。

関連する問題