angular - 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>

我的模态组件代码

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

感谢任何帮助我已经检查了文档和每个可能的链接。

Answer 1

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

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

Answer 2

根据文档，这是使用 ngdModal 将数据传递给内容的方法：

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

PS：“componentInstance”是角度测试 API 的一部分。