2016-09-04 15 views
5

私は自分の角型アプリケーションのディレクティブを作成しました。ディレクティブでtemplateUrlを使用してテンプレートを取得しています。角度指示文のテンプレートのパス?

templateUrl: 'templates/searchbox-template.html', 

これは私のローカルサーバー上でうまく働いたが、私はfirebaseにホストしたときに、それはこの警告は、ページを繰り返しページへのindex.htmlを追加し、ループ内で立ち往生また

WARNING: Tried to load angular more than once 

をrepeatedly-います。 ディレクティブを使用したナビゲーションバーの会社または仕事のタブに行くと、hereというアプリが表示されます。 これを止めるためにどのパスを使用すればよいかわかりません。ここにアプリケーションの構造はありますか?

. 
├── app 
│   ├── 404.html 
│   ├── favicon.ico 
│   ├── images 
│   ├── index.html 
│   ├── robots.txt 
│   ├── scripts 
│   ├── styles 
│   ├── templates 
│   └── views 
├── bower_components 
│   ├── angular 
│   ├── angular-mocks 
│   ├── angular-route 
│   ├── animate.css 
│   ├── bootstrap 
│   ├── jquery 
│   └── jssocials 
├── bower.json 
├── dist 
│   ├── 404.html 
│   ├── favicon.ico 
│   ├── fonts 
│   ├── index.html 
│   ├── robots.txt 
│   ├── scripts 
│   └── styles 
├── firebase.json 


. 
├── app 
│   ├── 404.html 
│   ├── favicon.ico 
│   ├── images 
│   ├── index.html 
│   ├── robots.txt 
│   ├── scripts 
│   │   ├── app.js 
│   │   ├── controllers 
│   │   ├── directives 
│   │   └── services 
│   ├── styles 
│   │   └── main.css 
│   ├── templates 
│   │   └── searchbox-template.html 
│   └── views 
│    ├── about.html 
│    ├── companiesall.html 
│    ├── company.html 
│    ├── contact.html 
│    ├── jobsall.html 
│    └── main.html 

ご覧のとおり、私のテンプレートはテンプレートフォルダにあります。これで私を助けてください。ありがとうございました。

アップデート - 私はちょうど右のパスを把握する必要があり

.otherwise({ 
     redirectTo: '/' 
     }); 

を - このanswerにAccoringは、ディレクティブは、したがって、このために何度も何度ものindex.htmlをロードしたテンプレートを見つけることができませんテンプレートの

{ 
    "hosting": { 
    "public": "dist", 
    "rewrites": [ 
     { 
     "source": "**", 
     "destination": "/index.html" 
     } 
    ] 
    } 
} 
+0

テンプレートが偶然NG-アプリディレクティブが含まれていることをしていますか?このメッセージは、すでにメインテンプレートにng-appがあり、そこにng-appを持つ別のテンプレートを読み込もうとした場合に発生します。 – stevenelberger

+0

いいえ、ng-appはindex.htmlファイル内にのみあります。 – doctorsherlock

+0

サーバの設定に依存しますが、 ''/''がルートディレクトリの' 'index.html''を参照している場合は、' '/ templates/searchbox-template.html' 'という正しいパスがあると思います。 – stevenelberger

答えて

2

'/'ビューへのマップmain.html?その場合、サーバはviewsディレクトリの下に静的にファイルを提供しており、templatesディレクトリへのアクセスは許可されていないようです。テストするには、テンプレートからテンプレートを取り出し、それをビューの下に置き、それに応じてtemplateUrlを変更してください。

Angularはディレクトリにアクセスして見つけることができないので、デフォルトでotherwise関数がロードされます。main.htmlは、問題を何度も何度もやり直します。

編集:

がケースで誰がこの問題を持っている、distディレクトリは、製品版だったし、単一のファイルからのビューを提供するために$templateCacheを使用しますが、ビューはに統合されたステップの間1つのファイルtemplatesディレクトリは考慮されておらず、見つけられませんでした。だからあなたのGruntfile.js、このように、他のフォルダを格納するためのテンプレートのsrcを変更するには:

ngtemplates: { 
     dist: { 
     options: { 
      module: 'jobSeekerApp', 
      htmlmin: '<%= htmlmin.dist.options %>', 
      usemin: 'scripts/scripts.js' 
     }, 
     cwd: '<%= yeoman.app %>', 
     src: ['views/{,*/}*.html', 'templates/{,*/}*.html'], 
     dest: '.tmp/templateCache.js' 
     } 
    }, 
0

インデックスページにリダイレクトしないでください -

これはfirebase.json JSONファイルの内容があります。あなたのアプリはindex.html上で実行されているため
インデックスページにリダイレクトされるたびに、アプリが再び開始されます。
代わりに、空白のURLを持つ別のページを使用して、そのページにリダイレクトします。
よう : -
'/' のような空白のURLとmain.jsまたはhome.jsのような1つのjsを作成します。
「/」にリダイレクトするたびに、アプリは何度も何度も開始されません。あなたはそのような警告を得ることはありません。

関連する問題