2016-06-20 63 views
1

我試圖綁定角度js組件中的通用屬性。我的組件包含文本框,我需要的是我想將html屬性傳遞給組件模板。 即將HTML屬性傳遞給角度js 1.5組件

<sample-component generic-attribute="ng-class='hello'"></sample-component> 

這是我的主要html組件。我需要將ng-class傳遞給我的組件模板。

(function() { 
     angular.module('myApp').component('sampleComponent',{ 
      bindings: { 
       genericAttribute:'@?' 
       }, 
      controllerAs:'ctrl', 
      controller: 'sampleController',   
      template:'<input type="text" {{ctrl.genericAttribute}} > 
      }); 
})(); 

是否可以傳遞整個屬性並將其綁定到模板中。

+0

如果你想,你可以傳遞類中的類。爲什麼你還想傳遞屬性是否有原因? – gyc

+1

所以它會很普遍。那就是開發人員可以在同一個密鑰上傳遞ng-class,id等。即

回答

1

你可以嘗試的東西是在模板生成函數中使用$compile。這應該讓你開始:

(function() { 
    angular.module('myApp').component('sampleComponent',{ 
     bindings: { 
      genericAttribute:'@?' 
      }, 
     controllerAs:'ctrl', 
     controller: 'sampleController', 
     template: function(tElement, tAttrs) { 
      return $compile('<input type="text"' + {{tAttrs.genericAttribute}}); 
     } 
     }); 
})(); 
+0

感謝您的回答。所以我不能用字符串模板來實現這一點。我可以嗎 ? –

+0

該函數將一個字符串返回給'template',因此兩者是等價的。 –

+0

當我嘗試這個我得到'$編譯未定義'錯誤。我怎樣才能將編譯功能傳遞給我的模板。 –