使用动态html

时间:2018-10-22 11:56:26

标签: html angular5

send(){

	const el = this.elementRef.nativeElement.querySelector('.eventlist');
	  if (el) {
	    el.addEventListener('click', this.accounType.bind(this));
	  }

}
accounType(id, message) {
	console.log(id, message);
}
component.html

<ul >
	<div *ngFor="let chat of chatContent; let i = index">
		<li [ngClass]="chat.type=='user' ? 'other': 'self'" [class]="'chat'+i">
		  <span *ngIf="chat.msgType=='text'" [innerHtml]=sanitizer.bypassSecurityTrustHtml(chat.message)></span>
		</li>
	</div>
</ul>


Dynamic HTML 

    <div class="btn-primary col-49 btn-inicio eventlist" (click)="accounType(1,2)">Coffee</div>
    <div class="btn-primary col-49 btn-inicio eventlist" (click)="accounType(1,4)">Tea</div>
在聊天框中动态创建的html,其中有一组按钮,单击事件在该按钮中不起作用

0 个答案:

没有答案