NG自舉+ angular4：動態HTML模式內容加載

Question

我有以下結構：

. 
├── companies.component.ts 
├── companies.html 
├── companies.service.ts 
└── components 
   └── modal 
    ├── modal.component.html 
    └── modal.component.ts 

我的模態分量是這樣的：

@Component({ 
    selector: 'service-modal', 
    templateUrl: './modal.component.html' 
}) 
export class ModalComponent implements OnInit { 

    public modalHeader: string; 
    public modalContent: string; 

    constructor(private activeModal: NgbActiveModal) { 
    } 

    public ngOnInit() { 
    } 

    public closeModal() { 
    this.activeModal.close(); 
    } 
} 

我用它從我的companies.component.ts是這樣的：

const activeModal = this.modalService.open(ModalComponent, { size: 'lg' }); 
activeModal.componentInstance.modalHeader = 'Create company'; 
activeModal.componentInstance.modalContent = 'company form'; 

我想使用模式組件來創建公司OR用戶實體。將html表單綁定到modalContent是否是一個好習慣？還有其他的方式嗎？我應該創建兩個不同的模式組件（一個用於用戶，一個用於公司）？

Answer 1

首先，您可能會在其他地方重新使用您的模態。所以你應該把這個組件放在一個'共享'文件夾中。

然後你有多個解決方案：

1. 隨着NG-內容。你創建你的模態組件或使用引導程序的。

<my-modal> 
    <my-comp-to-create-companies> 
    </my-comp-to-create-companies> 
</my-modal> 
<my-modal> 
    <my-comp-to-edit-companies></my-comp-to-edit-companies> 
</my-modal> 

你也許可以合併編輯/創建組件，因爲表單可能具有相同的性質。

動態組件裝載機：https://angular.io/guide/dynamic-component-loader