2013-04-19 3 views
0

JSON에서 가져온 속성 (select id, select class)을 사용하여 선택을 만들고 싶습니다 (내 컨트롤러에서 정의 됨).AngularJS에서 JSON의 속성으로 select 만들기

어떻게 할 수 있습니까? 또는 select의 코드로 동적 부분을 처리해야합니까?

JSON에 어떤 속성이 있는지 알 수 없다고 가정합니다.

감사합니다.

UPDATE : 예를 들어

,이 JSON이있는 경우 :

{ "topology" : [ 
     { "name": "id", "value":"topology_id" }, 
     { "name": "class", "value": "topology_class1 topology_class2" }, 
     { "name": "diasbled", "value": "disabled" } 
    ] 
} 

내가이 선택 태그 얻기 싶습니다 :

<select id="topology_id" class="topology_class1 topology_class2" disabled="disabled"></select> 

을 그리고를 나는 또 다른 JSON이있는 경우 다른 속성과 함께, 내 선택 태그에있을 이러한 다른 속성. 업데이트 된 JSON 파일을 사용하여

답변

1

, 당신은 같은 것을 할 수 있습니다 : 여기

// Your template 
<select dynamic-attributes='topology'></select> 

// The dynamic attributes directive 
angular.module('yourModule') 
    .directive('dynamicAttributes', ['jsonData', function (jsonData) { 
     return function (scope, element, attrs) { 
      // Get the attribute data from a service. 
      var attributes = jsonData.get(attrs.dynamicAttributes); 
      // Add each of the attributes to the element. 
      attributes.forEach(function (attribute) { 
       element.attr(attribute.name, attribute.value); 
      }); 
     } 
    }]); 

// The jsonData service 
angular.module('yourModule') 
    .service('jsonData', function() { 
     // This would really come from the server. 
     var json = { 
      "topology" : [ 
       { "name": "id", "value":"topology_id" }, 
       { "name": "class", "value": "topology_class1 topology_class2" }, 
       { "name": "diasbled", "value": "disabled" } 
      ] 
     }; 

     // Public API 
     return { 
      get: function (name) { 
       return json[name]; 
      } 
     }; 
    }); 

코드와 작업 바이올린의 : http://jsfiddle.net/nfreitas/SmWE8/이 (스타일링 상관 없어,이 속성이되고 있음을 보여주고있다 추가되었습니다.)

+0

답변 해 주셔서 감사합니다.하지만 JSON에 어떤 속성이 있는지 모르는 경우가 있습니다. JSON에 어떤 속성이 포함되어 있어도 모든 속성을 넣고 싶습니다. –

+0

JSON에 대한 예가 있습니까? JSON에 여러 가지 유형의 속성이 포함 된 경우 사용자 지정 지시문이 가장 좋은 옵션 일 수 있습니다. –

+0

나는 내 질문에 업데이트를 넣어, 제발 좀 봐. 고맙습니다! –

관련 문제