使用ngx-bootstrap将表单插入模态

时间:2017-11-07 19:39:44

标签: angular angular-cli ngx-bootstrap ngx-bootstrap-modal

我目前正在使用angular-cli的应用程序中做一些前端工作,我不是那么习惯。我已经完成了大部分工作,但我正在尝试将一个当前加载到表格上的论坛转换为模态。

目前,它来自另一个链接组件,并在html文件的顶部加载,如此。

<app-data-edit *ngIf="editEnabled" (editComplete)="onFinish($event)" [dataSet]="dataToEdit"></app-data-edit>

我将ngx-bootstrap加载到项目中并完成了所有设置。在their documentation, specifically the component example之后,我创建了一个简单的按钮并使其打开一个模态。到目前为止这么好,我可以使用模态体中的基本内容弹出模态。然后我尝试了这样的事情:

@Component({
    selector: 'modal-content',
    template: `
      <div class="modal-header">
        <h4 class="modal-title pull-left">{{title}}</h4>
        <button type="button" class="close pull-right" aria-label="Close" (click)="bsModalRef.hide()">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
         <app-data-edit *ngIf="editEnabled" (editComplete)="onFinish($event)" [dataSet]="dataToEdit"></app-data-edit>
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-default" (click)="bsModalRef.hide()">Close</button>
       </div>'
})
export class ModalContentComponent {
  title: string;
  constructor(public bsModalRef: BsModalRef) {}
}

它回来后没有结果。我错过了什么吗?

0 个答案:

没有答案