키와 값의 쌍(ng-value)
데이터 소스로서 어소시에이션 어레이를 사용해야 합니다.select
각도 사용 옵션JS.
이런 어레이를 사용할 수 있습니까?
{
"key1": "val1",
"key2": "val2",
"key3": "val3",
...
}
다음과 같은 결과를 얻을 수 있습니다.
<select>
<option value="key1">val1</option>
<option value="key2">val2</option>
<option value="key3">val3</option>
...
</select>
나는 논문을 읽지만, 어떻게 이것을 달성해야 하는지 이해할 수 없다.
사용하다ng-option
:
<select ng-model="blah" ng-options="key as value for (key , value) in data"></select>
또는 사용ng-repeat
:
<select>
<option ng-repeat="(key, value) in data" value="{{key}}">{{value}}</option>
</select>
컨트롤러의 데이터:
$scope.data = {
"key1": "val1",
"key2": "val2",
"key3": "val3",
...
};
다음 기사에서는 ngOptions를 사용할 수 있는 다양한 방법에 대해 설명합니다(지금까지 본 것 중 가장 명확하고 상세한 설명).http://www.undefinednull.com/2014/08/11/a-brief-walk-through-of-the-ng-options-in-angularjs/
Chen-Tsu Lin의 답변은 실제로 두 가지 방법으로 개체에 액세스할 수 있습니다.몇 줄만 더 추가해 주세요.
왜냐하면ng-repeat
디렉티브는 배열의 각 항목에 대해 HTML 코드 블록을 반복하며 드롭다운 목록에 옵션을 만드는 데 사용할 수 있지만,ng-options
directive는 드롭다운목록을 옵션으로 채우기 위해 특별히 작성되었으며 적어도1가지 중요한 이점이 있습니다.
드롭다운 작성 방법
ng-options
선택한 값을 객체로 할 수 있습니다.드롭다운은 다음과 같습니다.ng-repeat
문자열이어야 합니다.
참조 예 추가:
ng-repeat
: http://www.w3schools.com/angular/tryit.asp?filename=try_ng_select_repeat_selected
ng-options
: http://www.w3schools.com/angular/tryit.asp?filename=try_ng_select_object
자세한 내용은 http://www.w3schools.com/angular/angular_select.asp를 참조하십시오.
언급URL : https://stackoverflow.com/questions/21734524/key-value-pairs-in-ng-options
'programing' 카테고리의 다른 글
"jquery.unoblusive-ajax.js"는 폐지되었습니까? (0) | 2023.03.18 |
---|---|
이미지 높이와 너비가 작동하지 않습니까? (0) | 2023.03.18 |
각도의 산술 함수JS 바인딩 (0) | 2023.03.18 |
네트워크 인터페이스 이름의 길이는 몇 개입니까? (0) | 2023.03.18 |
wordpress : 페이지에 카테고리와 태그를 추가하는 방법 (0) | 2023.03.18 |