让我描述我想要做的事情。 我正在构建一个真正动态的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>
.

是某种方式吗?

我尝试了什么:目前,我设法为每行中的输入数组中的每个项目创建一个输入,我可以按生成的类型分配类型,但是HTML属性可以对每种类型的输入元素不同,我认为这将是令人讨厌的将属性分配给元素“硬编码”方式并陷入此处。

提前感谢任何反馈!

有帮助吗?

解决方案

这是你的Propune

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

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top