Question

我想制作一个自定义模态。问题是我不知道如何动态加载模板网址到模态。我可以做任何事情，但动态加载网址或其他类似方法。

谢谢， 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是一个内置工具，因此您无需导入任何内容！

如何使用角度2制作动态模态

1 个答案: