如何在页面上加载模态加载角度6

时间:2019-07-11 06:03:04

标签: javascript angular

我正在尝试创建模态,该模态将以角度6在页面加载时加载,在click方法上可以正常工作,该方法将传递一个参数

我尝试了ngOnInit,但是它的void类型没有参数

<ng-template #content let-c="close" let-d="dismiss">
        <div class="modal-header">
          <h4 class="modal-title" id="modal-basic-title">Select user</h4>
          <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
              <select >
                <option value="volvo">Rohait</option>
                <option value="saab">Anuj</option>
              </select>   
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-outline-dark" (click)="c('Save click')">Save</button>
        </div>
      </ng-template>

启动演示模式

我正在使用此

open(content) {
      this.modalService.open(content);
     }

但是它在这里不起作用,它在单击方法上起作用

1 个答案:

答案 0 :(得分:0)

如果首先使用Angular 8,则可以声明它。

@ViewChild('content', { static: true }) content: TemplateRef<any>;

但是,对于使用Angular 7及更低版本的用户,您应该改用它。

@ViewChild('content') content: TemplateRef<any>;

以上内容使您可以访问类中的content模板引用变量。

在您的ngOnInit上,

ngOnInit() {
  this.modalService.open(this.content);
}

请记住将ViewChild以及TemplateRef导入到component.ts中,

import { TemplateRef, ViewChild } from '@angular/core';

这应该允许您的modalService打开模式。