角2（变化）事件不触发

我曾经在我的组件以下功能：角2（变化）事件不触发

onProductSelect(e){ 
     var attrs = document.getElementById('firstAttr');   
     return this.groupComponentSvs.getProduct(e.target.value) 
         .subscribe(
          selectProduct=>{         
           this.selectProduct=selectProduct; 
           var select = "<select class='form-control' id='"+ selectProduct.attribute +"' (change)='selectNextAttr($event)' name='selectProd'>"; 
           console.log(select); 
            select+= '<option value="0">Select</option>'; 
           for (var i=0; i<selectProduct.values.length; i++) { 
            select+= '<option value='+ selectProduct.values[i]+ '>'+ selectProduct.values[i] +'</option>'; 
           } 
           select+='</select>' ;         
           attrs.innerHTML = '<div id=attr_'+ selectProduct.attribute +'>'+ select +'</div>';        
           error=>this.errorMessage = <any>error 
          }        
       )     

    } 

selectNextAttr(attr, val){ 
console.log("this is a test"); 
}

我能够插入选择菜单中的我的HTML页面，但变化事件未与我触发选择一个物品。有人能告诉我为什么会发生这种情况吗？

感谢

来源

2017-05-10 aej1973

请分享您的HTML代码 –

确定在Angular 2中有'（change）'事件有问题，如果您注意的话，它和'（blur）'的作用相同。是的，您可以使用'（ngModelChange）这会在用户输入发生一些变化时立即触发 – mayur

您应该使用ngModelChange，而不是change

"<select class='form-control' id='"+ selectProduct.attribute +"' (ngModelChange)='selectNextAttr($event)' name='selectProd'>"

来源

2017-05-10 05:19:42 Sajeetharan

尝试过，但它仍然不起作用。 – aej1973

检查这个答案：https://stackoverflow.com/a/33716321/2114024

尝试：

<select [ngModel]='selectedProduct' 
     class='form-control' 
     [id]='"+ selectProduct.attribute +"' 
     (ngModelChange)='selectNextAttr($event)' name='selectProd'>

来源

2017-05-10 06:01:50 Malick

感谢您回到我身边，似乎仍然无法正常工作。如果我做了以下工作，但我需要使用ts动态地添加它： – aej1973

HTML代码： – aej1973

TS：onProductSelect（e）{ // var attrs = document.getElementById（'firstAttr'）; 返回this.groupComponentSvs.getProduct（e.target.value） .subscribe（ selectProduct => { this.selectProduct = selectProduct; 误差=> this.errorMessage = 错误 } ） } – aej1973

使用[innerHTML]="..."添加的HTML是而不是以任何方式通过Angular进行处理，并且不会为此类HTML创建组件，指令。为了安全起见，Angular认为这种HTML只是一种消毒方式。

因此，你不能使用[ngModel]="..."或(ngModelChange)="..."

一种方式来处理这种要求是在运行时动态创建组件，并使用创建的HTML作为模板，这样的组件。请参阅Equivalent of $compile in Angular 2了解如何完成此操作。

来源

2017-05-10 06:05:22

角2（变化）事件不触发

回答

相关问题