动态添加到DOM上的代码。
<ul>
<li>
<button (click)="Onclick(abc)" class="btn btn-sm btn-danger click_for_save pull-right" type="button">
<i class="fa fa-close"></i> Save </button>
</li>
</ul>
在HTML代码中,有一个带有参数的click事件。(click)="Onclick(abc)"
现在我正在动态地添加它。因此,click事件不起作用。
我已经搜索了很多,但还是找不到解决方案。我的打字代码如下。
import { AfterViewInit, Component, ElementRef} from '@angular/core';
constructor(private elementRef:ElementRef) {}
// Below code I have added just after the dynamically added code.
this.elementRef.nativeElement.querySelector('.click_for_save')
.addEventListener('click', this.click_for_save.bind(this));
Onclick(abc) {
console.log(abc);
}
我得到了这个错误。
ERROR TypeError: Cannot read property 'addEventListener' of null
但是click事件没有触发。我甚至尝试过3秒间隔的SetTimeOut()
函数。
编辑:-
我正在检查这个,
let query_selector_value = this.elementRef.nativeElement.querySelector('.click_for_save');
if(query_selector_value){
query_selector_value.addEventListener('click', this.click_for_save.bind(this));
}
我要让query_selector_value - null
发布于 2018-06-04 22:41:35
尝试下面这一行,同时检查以确保这个类只有一个元素:
this.elementRef.nativeElement.querySelector("[class='click_for_save']")
.addEventListener('click', this.click_for_save.bind(this));
还可以尝试查看是否有多个元素具有相同的类:
var button = document.querySelector("[class='click_for_save']");
console.log(button);
看看它是否有任何元素。
更新:
试试这个
$("body").on("click", ".click_for_save", function(){
//do something
});
https://stackoverflow.com/questions/50682936
复制相似问题