角2を使って動的モーダルを作る方法

Question

私はカスタムモーダルを作りたいです。問題は、動的にテンプレートURLをモーダルにロードする方法がわかりません。私はすべてを行うことができますが、URLやその他の同様のアプローチを動的にロードします。

おかげで、 MW

Answer 1

それは簡単です！あなたのモーダルを表すコンポーネントを作成し、ngTransclusionを使用してhtmlをコンポーネント内に挿入します。 例：モーダルを使用して

// my-modal.component.ts 
import {Component} from 'angular2/core'; 

@Component({ 
    selector: 'my-modal', 
    template: ` 
    <div> 
     <ng-content></ng-content> 
    </div> 
    ` 
}) 
export class MyModal{} 

：

// app.component.ts 
import {Component} from 'angular2/core'; 
import {MyModal} from './my-modal.component'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div class="app"> 
     <my-modal> 
     This is my transcluded content inside my modal! 
     </my-modal> 
    </div> 
    `, 
    directives: [ 
    MyModal 
    ] 
}) 
export class AppComponent {} 

NgTransclusionは組み込みのツールですので、あなたは何をインポートしないようにする必要はありません！