代码之家 › 专栏 › 技术社区 › yavg

无法读取未定义的属性“show”(调用模态)

angular

yavg · 技术社区 · 6 年前

我有一个代码,只需将这段代码放入其中:

(click)="crearProcesoAsociado.show()"  //#crearProcesoAsociado id of my modal

我的名字叫莫代尔。以前,我的代码是这样的,模式调用工作得很好。

<a type="button"  (click)="crearProcesoAsociado.show()" >
  open modal
</a>
<div mdbModal #crearProcesoAsociado="mdbModal" class="modal fade" id="crearProcesoAsociado" tabindex="-1" role="dialog"
  aria-labelledby="crearProcesoAsociado" aria-hidden="true" [config]="{backdrop: true, ignoreBackdropClick: false}">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
    .
    .
    .

但是为了维护我的代码,我决定专门为我的modal创建一个组件,其中包含相应的html。

<modal_procesos></modal_procesos>

现在有了这些变化,我不知道为什么它不起作用

HTML父级

<a type="button"  (click)="crearProcesoAsociado.show()" >
  open modal
</a>
<modal_procesos ></modal_procesos>

<div mdbModal #crearProcesoAsociado="mdbModal" class="modal fade" id="crearProcesoAsociado" tabindex="-1" role="dialog"
  aria-labelledby="crearProcesoAsociado" aria-hidden="true" [config]="{backdrop: true, ignoreBackdropClick: false}">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
.
.
.

我怎样才能解决它?我用的是角度6

2 回复 | 直到 6 年前

Dhananjai Pai 6 年前

在第一种情况下,您指的是templateRef crearProcesoAsociado

#crearProcesoAsociado="mdbModal" <--- this

当您将其移动到另一个组件时,就没有其他组件了在模板中,以允许您访问 show() 作用

要解决此问题,必须在 modal_procesos 打电话 show 克瑞波克索西亚多酒店 crearProcesoAsociado.show() 从新创建的函数内部。此外,还必须将templateRef附加到 模态程序 称之为 show() 方法同上。

在里面 HTML父级

<a type="button"  (click)="modalProcesos.show()" >
  open modal
</a>
<modal_procesos #modalProcesos ></modal_procesos>

在里面组件.ts

@ViewChild(crearProcesoAsociado) crearProcesoAsociado;

... // other code

public show() {
    this.crearProcesoAsociado.show()
}

Gabriel George 6 年前

据我所知,不是那样的。如果要执行此操作,则必须使用viewChild引用子组件,然后必须调用该方法以打开模态。e、 g.使用 MDBModalRef

因此,在父组件上,您可以使用:

@ViewChild('crearProcesoAsociado') <YourModalComponentNameHere>

openModal(){ 
  YourModalComponentNameHere.open()
}

然后在您的孩子身上,您可以:

constructor(private modalRef: MDBModalRef) {}

open(){
  this.modalRef.open();
}

推荐文章

Kiara · 根据条件角度显示多个模板

1 年前

IonicMan · 剑道网格在宽度过大时不显示某些列

1 年前

Piotr Deja · 如何在subscribe方法中为参数赋值,然后从组件内部的任何位置检索该值?

1 年前

Ben5 · 服务器端总是接触FormControl

1 年前

allforthenoob · 我该怎么分类?

1 年前

Hamid Elouardaoui · 角度生成:发生未处理的异常:服务不再运行

1 年前

Hugh Jones · 如何创建适用于多个来源的自签名开发证书

1 年前

jthorn · 角度对象未在HTML中显示

1 年前

clem · 如何在Angular应用程序中突出显示页面的一部分?

2 年前

Kael · 在html表格中显示关系api数据-角度

2 年前