2016-12-13 3 views
0

私は角度2で出会ったすべての例で、すべての単一ページで角度2を使用し、AppComponentがそのページに存在することを期待しています。 AppComponentが欠落している場合は、次のエラーがあります:アプリケーションで角度2を部分的に使用する正しい方法は何ですか?

Error in :0:0 caused by: The selector "my-app" did not match any elements 

アプリの残りの部分は、サーバー側でレンダリングされるのに対し、部分的にアプリケーション内の角度2を使用するのが正しいと有利な方法は何ですか?

角度1では、特定のページに角度が必要ない場合は、ng-appというディレクティブを含めることはできません。角度2はng-appの指令を持たないのと同じですか?

答えて

1

実際には、angular2のブートストラップ自体を知ることができます。メインファイルの翻訳されたコードを見て、どのように処理されているかを確認し、独自のロジックをページに追加して実行するかどうかを判断します。

+0

私はAngularを使用する点がこれをやらなければならないことを避けることだと考えました。 Angular1の優雅さは、そのような指令が存在しなければ条件付きでブートストラップする必要はないということです。 – Mistlight

+1

Angular2は、それが含まれているどのページにも読み込まれるように設計されています。私は、設計された方法に反する提案をしています。より良い方法は、使用されていないページにはロードしないことです。 –

+0

あなたの提案に感謝します。私は失礼や何かを意味するわけではありませんでしたが、私はこれを念頭に置いています。 – Mistlight

0

@PaulジェロームBordalloの答えを拡張し、我々はこのように見えるようにブートストラップスクリプトを変更することができます得るために

<my-app id="load-angular"></my-app> 

const elemExists = document.getElementById("load-angular"); 

if(elemExists) { 
    platformBrowserDynamic().bootstrapModule(AppModule); 
} 

だからあなたのhtmlに、私たちのようなものを持っている可能性があり機能的に私たちは欲しい。

+1

サーバ側で 'elemExists'ができるかどうかを制御していた部分。 –

1

サーバー側でレンダリングされるアプリケーションに、Angular2アプリケーションのブートストラップに必要なスクリプトとタグを含めることができます。アプリケーションの他の部分では、Angular 2のタグとディレクティブを使用せずにHTMLを通常通りレンダリングします。唯一の違いは、同じリンクでrouterLinkの代わりにhref属性が必要だということです。

関連する問題