문제

내가 무엇을하려고하는지 묘사하자. 제공된 데이터 배열 및 구성 객체를 기반으로 테이블을 빌드하는 데 실제로 동적 인 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 속성이 다를 수 있습니다."하드 코딩 된"요소에 속성을 지정하고 여기에 갇혀 있습니다.

어떤 의견을 미리 감사드립니다!

도움이 되었습니까?

해결책

당신을 위해 펑크가 있습니다 :

.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