Angular HTMLテンプレートを切り替えることは可能ですか?

エイドリアン・サウィッキ

mobile: boolean価値を保持するサービスがあるとしましょうそれに応じて、それを必要とするコンポーネントに適切なTemplateUrlを表示します。

だからそれは次のようなものになります TemplateUrl: condition ? template_1 : template_2

requireと同様のものを作成できますが、prod用に適切にビルドされません。それを使用してページに移動するとnull、テンプレートの代わりに表示されます(製品のみ)。

Angularバージョン7

ノレマック

@Component宣言は、AOT合併症で静的に処理され、templateUrl変数に基づいて提供することができません。

これを処理する方法は、ページのレンダリング方法からロジックを分離することです。モバイルとデスクトップで異なる方法で表示されるUIは、個別のコンポーネントを作成できます。メインコンポーネントまたは共有基本クラスまたはコンポーネントには、すべてのロジックが含まれている必要があります。

<div>

  <p>Graph:</p>

  <graph-mobile *ngIf="mobile" [data]="data"></graph-mobile>

  <graph-desktop *ngIf="!mobile" [data]="data"></graph-desktop>

</div>

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

Angular 4+:テンプレートへの文字列入力をHTMLとして評価することは可能ですか?

分類Dev

templateUrl(Angular 7)の条件を使用して、モバイルテンプレートとデスクトップテンプレートを切り替えます

分類Dev

Angular2テンプレートでngIFのケースを多く持つことは可能ですか?

分類Dev

Angularコンポーネント内にHTMLコンテンツを含めることは可能ですか?

分類Dev

コンポーネントテンプレートで<ng-content> </ ng-content>を再利用することは可能ですか?Angular2

分類Dev

Angularでは、テンプレート内でコピーオブジェクトを作成することは可能ですか?

分類Dev

テンプレートからAngular2 +を使用してブートストラップラジオボタンを切り替える

分類Dev

テンプレートからAngular2 +を使用してブートストラップラジオボタンを切り替える

分類Dev

テンプレートのようなAngular5のコンポーネントを切り替える方法は?

分類Dev

Angular 2で同じコンポーネントのスタイルを変えることは可能ですか?

分類Dev

ng-bootstrap Angular2タイプスクリプトでタブを切り替えるときに以前のngbTabコンテンツを保持する方法

分類Dev

ng-bootstrap Angular2タイプスクリプトでタブを切り替えるときに以前のngbTabコンテンツを保持する方法

分類Dev

Angularディレクティブを使用してDOMに切り替え可能なボタンを追加する

分類Dev

スイッチをクリックしたときにAngularでダークテーマを切り替えるにはどうすればよいですか?

分類Dev

Angular js-HTMLタグ<button>を使用してルーティングすることは可能ですか?

分類Dev

Angularテンプレートでタイプナローイングを行うことはできますか?

分類Dev

Angular-子コンポーネント内からコンテンツプロジェクションを使用することは可能ですか?

分類Dev

Angular MaterialButtonレイアウト/ビューを切り替えるために切り替えます

分類Dev

Angular CLI からコンポーネント (パイプ - ect) を削除することは可能です

分類Dev

jQueryイベントでAngularスコープを変更することは可能ですか?

分類Dev

Angularアプリケーションのポート番号を構成することは可能ですか?

分類Dev

Angular2でレイアウトを切り替える方法

分類Dev

Angular2でレイアウトを切り替える方法

分類Dev

Angular2でレイアウトを切り替える方法

分類Dev

Angular:strictTemplates-テンプレートでブール値と数値を適切に設定する方法は?

分類Dev

他のアプリケーションのローカルストレージをAngular2で読み取ることは可能ですか?

分類Dev

Angular 8で言語を切り替える方法はありますか?

分類Dev

Angularテンプレートエンジンを介していくつかのブロックを表示/非表示(切り替え)

分類Dev

Angularテンプレートを実行しているときのVSのdistディレクトリはどこにありますか?

Related 関連記事

  1. 1

    Angular 4+:テンプレートへの文字列入力をHTMLとして評価することは可能ですか?

  2. 2

    templateUrl(Angular 7)の条件を使用して、モバイルテンプレートとデスクトップテンプレートを切り替えます

  3. 3

    Angular2テンプレートでngIFのケースを多く持つことは可能ですか?

  4. 4

    Angularコンポーネント内にHTMLコンテンツを含めることは可能ですか?

  5. 5

    コンポーネントテンプレートで<ng-content> </ ng-content>を再利用することは可能ですか?Angular2

  6. 6

    Angularでは、テンプレート内でコピーオブジェクトを作成することは可能ですか?

  7. 7

    テンプレートからAngular2 +を使用してブートストラップラジオボタンを切り替える

  8. 8

    テンプレートからAngular2 +を使用してブートストラップラジオボタンを切り替える

  9. 9

    テンプレートのようなAngular5のコンポーネントを切り替える方法は?

  10. 10

    Angular 2で同じコンポーネントのスタイルを変えることは可能ですか?

  11. 11

    ng-bootstrap Angular2タイプスクリプトでタブを切り替えるときに以前のngbTabコンテンツを保持する方法

  12. 12

    ng-bootstrap Angular2タイプスクリプトでタブを切り替えるときに以前のngbTabコンテンツを保持する方法

  13. 13

    Angularディレクティブを使用してDOMに切り替え可能なボタンを追加する

  14. 14

    スイッチをクリックしたときにAngularでダークテーマを切り替えるにはどうすればよいですか?

  15. 15

    Angular js-HTMLタグ<button>を使用してルーティングすることは可能ですか?

  16. 16

    Angularテンプレートでタイプナローイングを行うことはできますか?

  17. 17

    Angular-子コンポーネント内からコンテンツプロジェクションを使用することは可能ですか?

  18. 18

    Angular MaterialButtonレイアウト/ビューを切り替えるために切り替えます

  19. 19

    Angular CLI からコンポーネント (パイプ - ect) を削除することは可能です

  20. 20

    jQueryイベントでAngularスコープを変更することは可能ですか?

  21. 21

    Angularアプリケーションのポート番号を構成することは可能ですか?

  22. 22

    Angular2でレイアウトを切り替える方法

  23. 23

    Angular2でレイアウトを切り替える方法

  24. 24

    Angular2でレイアウトを切り替える方法

  25. 25

    Angular:strictTemplates-テンプレートでブール値と数値を適切に設定する方法は?

  26. 26

    他のアプリケーションのローカルストレージをAngular2で読み取ることは可能ですか?

  27. 27

    Angular 8で言語を切り替える方法はありますか?

  28. 28

    Angularテンプレートエンジンを介していくつかのブロックを表示/非表示(切り替え)

  29. 29

    Angularテンプレートを実行しているときのVSのdistディレクトリはどこにありますか?

ホットタグ

アーカイブ