无法从角度6中的另一个零部件打开模态零部件

Question

我想在用户单击按钮时从home.component中打开一个modal.component作为模态。

modal.component.html

<ng-template #contentmod let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">{{header}}</h4>
<button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')">
 <span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
  <p>Hello, World!</p>
</div>
<div class="modal-footer">
 <button type="button" class="btn btn-outline-dark">Save</button>
</div>
</ng-template>

home.component.html

<button (click)="openIt()">Click Me</button>

home.component.ts

export class HomeComponent implements OnInit {
   head = 'My Modal';
   @ViewChild(ModelComponent) model;
   @ViewChild('contentmod') modelcon: ModelComponent;
   constructor(private modalService: NgbModal) { }
   ngOnInit() {}
   onComplete(event) {
     console.log(event);
   }
   openIt() {
     this.modalService.open(this.modelcon, {});
   }
 }

我正在尝试此操作，但模型未打开。我该怎么解决？