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">