AngularJS：如何將對象映射到HTML屬性

Question

讓我描述一下我正在嘗試做什麼。 我正在構建一個真正動態的ng指令，以基於提供的數據數組和配置對象來構建表。我想知道的是如何基於範圍內的對象動態分配屬性。比方說，我喜歡的範圍有一個對象某處：

$scope.inputs.myInput = { 
    type : "number", 
    size : 3, 
    min : 0, 
    ... 
} 

等和地方在我的模板是

<tr><td>other stuff</td><td><input {{assign the attributes somehow}} /></td></tr> 

，其結果將是：

<tr><td>other stuff</td><td><input type='number' size='3' min='0' ... /></td></tr> 

這是莫名其妙可能？

我試過了：目前，我設法爲每一行輸入數組中的每一項創建一個輸入，我可以通過type={{type}}指定一個類型，但對於每種輸入元素，html屬性可能不同，我認爲它會是令人討厭的是爲元素「硬編碼」分配屬性並卡在這裏。

在此先感謝您的任何反饋意見！

Answer 1

Here's a plunk for you：

.directive('dynamicAttributes', function($parse){ 
    return function($scope, $element, $attrs) { 
    var attrs = $parse($attrs.dynamicAttributes)($scope); 
    for (var attrName in attrs) { 
     $attrs.$set(attrName, attrs[attrName]); 
    } 
    } 
}) 

您的屬性名稱 - 值對的對象只是傳遞到dynamic-attributes屬性和指令將其添加爲您：

dynamic-attributes="{style:'background: red;height:200px;', class: 'red'}" 

你的情況，那將是什麼像這樣：

<input dynamic-attributes="inputs.myInput">