本文介绍了以编程方式打开 ng-bootstrap 模式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个 Angular 4 页面,包括一个 ng-bootstrap 模式.我的代码如下所示.

I've got an angular 4 page including a ng-bootstrap modal. My code looks like this.

foo.html

[...]
<button class="btn btn-sm btn-secondary material-icons"
(click)="open(content)">search</button>

<ng-template #content let-c="close" let-d="dismiss">
    content in here
</ng-template>
[...]

foo.ts

[...]
constructor(private modalService: NgbModal) { }
[...]
open(content) {
   let options: NgbModalOptions = {
     size: 'lg'
   };

   this.modalService.open(content, options);
}
[...]

现在,当我单击按钮时,模式会打开.我现在要做的是在 ngChanges 上打开模型.

Now when I click the button the modal opens. What I want to do now is open the model on ngChanges.

ngOnChanges(changes: any) {
   open(content)
}

我的问题是:如何在这里获取内容"?有没有办法以编程方式获取 ng-template?提前致谢!

My problem is: How do I get the "content" here? Is there any way to get the ng-template programmatically? Thanks in advance!

推荐答案

要访问类中的 content 元素,请声明:

To access the content element inside the class, declare:

@ViewChild('content', { static: false }) private content;
                         ^for Angular8+

并在类的顶部添加相应的导入:

and add the corresponding import at the top of the class:

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

最后在更改检测时为该元素调用 open 方法:

and finally call open method for that element on change detection:

ngOnChanges(changes: any) {
   this.open(this.content);
}

这篇关于以编程方式打开 ng-bootstrap 模式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-23 12:18
查看更多