/ / Angular ng-model ng-selected - angularjs, model, ng-repeat, selected

Angular ng-model ng-selected - angularjs, model, ng-repeat, selected

Chcę powiązać wartość modelu z wybranym elementem

<select id="hours" ng-model="v.T_Hour">
<option ng-repeat="n in [].constructor(24) track by $index" ng-selected="{{$index==v.T_Hour}}" value="{{$index}}">{{$index>9?$index:"0"+$index}}:00</option>
</select>

Chcę po wczytaniu strony wartośćmodel „v.T_Hour” do wybrania w select, przypisuję wartość modelu w kontrolerze, kiedy przeglądam wynikowy HTML, widzę, że wartość jest wybrana w kodzie HTML, ale nie jest zaznaczona w kontrolce select, i formant wyboru wyświetla pusty element.

Odpowiedzi:

1 dla odpowiedzi № 1

Spróbuj tego

<select
name="name"
id="id"
ng-options="option.name for option in v.data track by option.value"
ng-model="v.selected"
class="form-control inline-forms">
<option value="" selected>{{placeHolder}}</option>
</select>

i w kontrolerze

$scope.v = {data:[], selected:{}, placeHolder:""}
$scope.v.data = [{name:"nameOne", value:"valueOne"},{name:"nameTwo", value:"valueTwo"},{name:"nameThree", value:"valueThree"}]
$scope.v.selected = $scope.v.data[0]
$scope.v.placeHolder = "Click to Select"

Według dokumentacji kątowej ngOption jestlepszy sposób na przejście niż ngRepeat: Wybieranie między ngRepeat i ngOptions W wielu przypadkach ngRepeat może być zastosowany na elementach zamiast ngOptions, aby osiągnąć podobny wynik. NgOptions zapewnia jednak pewne korzyści:

większa elastyczność w przypisywaniu modelupoprzez select jako część wyrażenia rozumienia zmniejszone zużycie pamięci, nie tworząc nowego zakresu dla każdej powtarzanej instancji zwiększona szybkość renderowania poprzez tworzenie opcji w DocumentFragment zamiast pojedynczo W szczególności wybierz z powtarzanymi opcjami znacznie spowalnia od 2000 opcji w Chrome i Internet Explorer / Edge. widzieć: https://docs.angularjs.org/api/ng/directive/select