NgbModal 上未定义的 ComponentInstace

Question

从昨天晚上开始我一直在想为什么这段代码不起作用

onOutletFeedback(content) {
    const modalRef  = this.modalService.open(content, {
      scrollable: false,
      size: 'md'
    });
    modalRef.componentInstance.contactId = this.contactId; //Facing issue at this line
    modalRef.componentInstance.url = environment.apiUrl;
    modalRef.result.then(
      result => {
        // on save click
      },
      reason => {
        // on dismiss
        console.log(`Dismissed with: ${reason}`);
      }
    );
  }

当我尝试调用我的模式时，我总是遇到这个错误。

我的模态代码

    <button (click)="onOutletFeedback(OutletFeedbackModal)"
                  class="btn btn-secondary"
                  placement="bottom"
                  ngbTooltip="Feedback" >
                  <i class="icon-comment"></i></button>

<ng-template #OutletFeedbackModal let-modal>
  <app-outlet-feedback [modal]="modal"></app-outlet-feedback>
</ng-template>

我的 ModalComponent 代码

export class OutletFeedbackComponent implements OnInit {
  @Input() modal: any;
  @Input() contactId: number;

感谢任何帮助我已经检查了文档和所有可能的方法 link。

Answer 1

按照医生的说法，这里是用ngbModal向内容传递数据的方法：

this.modalRef['data'] = "any data you want to pass to ModalComp class";

PS：'componentInstance' 是 angular 测试的一部分 API。

Answer 2

您可以将输入属性值直接分配给 app-outlet-feed 试试这个：

<ng-template #OutletFeedbackModal let-modal>
     <app-outlet-feedback [contactId]="contactId" [modal]="modal"></app-outlet-feedback>
</ng-tempalte>

NgbModal 上未定义的 ComponentInstace

ComponentInstace undefined on NgbModal

angular

typescript

ng-bootstrap

ng-bootstrap-modal