programing

단순한 어레이 초기화를 사용한ng-timeout

css3 2023. 3. 21. 22:25

단순한 어레이 초기화를 사용한ng-timeout

앵글이랑 좀 헷갈리고ng-options.

심플한 어레이를 사용하고 있으며, 이 어레이로 셀렉트를 개시하고 싶습니다.단, 그 옵션의 값은 =라벨로 해 주셨으면 합니다.

script.discripts.discripts: 스크립트

$scope.options = ['var1', 'var2', 'var3'];

html

<select ng-model="myselect" ng-options="o for o in options"></select>

얻을 수 있는 것

<option value="0">var1</option>
<option value="1">var2</option>
<option value="2">var3</option>

원하는 것:

<option value="var1">var1</option>
<option value="var2">var2</option>
<option value="var3">var3</option>

그래서 나는 시도했다:

<select ng-model="myselect2" ng-init=0 ng-options="options[k] as v for (k,v) in options"></select>

<select ng-model="myselect3" ng-init=0 ng-options="b as b for b in options"></select>

(하지만 효과가 없었습니다.)

편집:

제 양식은 외부에 제출되어 있기 때문에 0이 아닌 'var1'이 값으로 필요합니다.

사실 세 번째 시도에서 맞췄어요

 <select ng-model="myselect" ng-options="o as o for o in options"></select>

http://plnkr.co/edit/xEERH2zDQ5mPXt9qCl6k?p=preview 의 작업 예를 참조해 주세요.

비결은 '앵글(Angular가어쨌든 JS는 키를 0 ~n의 숫자로 쓰고 모델을 업데이트할 때 다시 변환합니다.

그 결과 HTML은 부정확하게 표시되지만 값을 선택할 때 모델은 올바르게 설정됩니다.(예: 각도)JS는 '0'을 'var1'로 변환합니다.)

Epokk의 솔루션도 작동하지만 데이터를 비동기적으로 로드하는 경우 항상 올바르게 업데이트되지 않을 수 있습니다.ngOptions를 사용하면 스코프가 변경되면 올바르게 새로 고쳐집니다.

사용할 수 있습니다.ng-repeat와 함께option다음과 같습니다.

<form>
    <select ng-model="yourSelect" 
        ng-options="option as option for option in ['var1', 'var2', 'var3']"
        ng-init="yourSelect='var1'"></select>
    <input type="hidden" name="yourSelect" value="{{yourSelect}}" />
</form>

송신할 때form입력 값을 숨길 수 있습니다.


DEMO

ng선택의 ng-interface(ng-interface.

다음과 같이 선택 항목을 설정할 경우:

<select ng-model="myselect" ng-options="b for b in options track by b"></select>

다음을 얻을 수 있습니다.

<option value="var1">var1</option>
<option value="var2">var2</option>
<option value="var3">var3</option>

바이올린 작업: http://jsfiddle.net/x8kCZ/15/

이런 게 필요할 것 같아

<select ng-model="myselect">
    <option ng-repeat="o in options" ng-selected="{{o==myselect}}" value="{{o}}">
        {{o}}
    </option>
</select>

ng-selected를 사용하여 myselect가 미리 채워진 경우 옵션을 미리 선택합니다.

ng-options는 어레이에서만 동작하기 때문에 ng-options보다 이 방법을 선호합니다.ng-module은 json과 같은 오브젝트에서도 동작합니다.

<select ng-model="option" ng-options="o for o in options">

생성된 html에 value="0"이 표시되어도 $var1.option은 변경 후 'var1'과 동일합니다.

플런커

언급URL : https://stackoverflow.com/questions/18202106/ng-options-with-simple-array-init