IE10 z wykorzystaniem wybranych NG-opcji bez wartości domyślnej ustawionej w modelu zawsze wybiera pierwszy element w rozwijanym

Używam kątowa v1.0.8IE10 z wykorzystaniem wybranych NG-opcji bez wartości domyślnej ustawionej w modelu zawsze wybiera pierwszy element w rozwijanym

mam wybrać i używam NG-options dyrektywy, aby wypełnić go z tablica danych zadeklarowana w moim kontrolerze.

kod HTML

<body ng-controller="SelectCtrl"> 
    <select 
    ng-model="selected" 
    ng-options="o as o.caption for o in options" /> 
</body>

Fragment kodu

angular.module('app', []) 
    .controller('SelectCtrl', ['$scope', function($scope) { 

    $scope.options = [ 
     { key: 1, caption: '1' }, 
     { key: 2, caption: '2' }, 
     { key: 3, caption: '3' }, 
     { key: 4, caption: '4' }, 
     { key: 5, caption: '5' } 
    ]; 

}]);

W Chrome, jeśli wybierzesz powiedzmy opcja 3 następnie, zgodnie z oczekiwaniami, to zostanie wybrany.

Jednak w IE10 po wybraniu opcji 3 zostanie wybrana opcja 1.

(http://plnkr.co/edit/T9bbEW?p=preview)

Dzieje się tak tylko, gdy nie ma wybór domyślny ustawiony w sterowniku. Kolejne selekcje zrobione po usunięciu "pustego" wyboru zostaną poprawnie ustawione.

Podejrzewam, że może to być duplikat This issue, ale nie jestem do końca pewien. Nie zmieniam w sposób dynamiczny opcji, choć wydaje mi się, że być może Angular jest tak, ponieważ "pusty" wybór zostaje usunięty w obu przeglądarkach.

Jednak chcę tę funkcję. Nie chcę podawać wartości domyślnej dla tego wyboru, ponieważ użytkownik musi dokonać dla mnie aktywnego wyboru.

Czy ktoś zna obejście i/lub rozwiązanie tego problemu? Najlepiej taki, który nie ma nic wspólnego z opcjami przy użyciu JQuery ...

Źródło

2013-10-15 ivarni

Pusty przedmiot dodany kątowo ma dziwne zachowanie. Sposób, w jaki dotarłeś wokół niego jest jawnie dodać własną pusty element i wybrać go za pomocą regulatora:

angular.module('app', []).controller('SelectCtrl', ['$scope', function($scope) { 

    $scope.options = [ 
    { key: 0, caption: ' ' }, 
    { key: 1, caption: '1' }, 
    { key: 2, caption: '2' }, 
    { key: 3, caption: '3' }, 
    { key: 4, caption: '4' }, 
    { key: 5, caption: '5' } 
    ]; 

    $scope.selected = $scope.options[0] 

}]);

Źródło

2013-10-15 18:33:24

Obawiałem się, że będę musiał zrobić coś takiego. Dobrze wiedzieć, że nie tylko ja to robię :) – ivarni

to naprawić dodając następującą domyślną opcją do wybierz.

<option value="">Pls select</option>

więc wybierz wyglądałby następująco:

<body ng-controller="SelectCtrl"> 
<select 
    ng-model="selected" 
    ng-options="o as o.caption for o in options"> 
    <option value="">Pls select</option> 
</select>

Testowałem to w IE 11, 10, 9 i wydaje się działać. Proszę dać mi znać, czy to działa również dla Ciebie.

Myślę, że to jest czystsze niż powyższe rozwiązanie.

Źródło

2015-01-08 23:32:19 user2852277

Działa to w IE9 i IE10, jeśli twoja domyślna wartość opcji NIE wymaga interpolacji (np. "Wybierz proszę" działa, "{{" Wybierz "}} " nie). Rozwiązanie Phila Sandlera z przygotowaniem pustej opcji do tablicy wydaje się w tym przypadku wykonać zadanie. –

IE10 z wykorzystaniem wybranych NG-opcji bez wartości domyślnej ustawionej w modelu zawsze wybiera pierwszy element w rozwijanym

Odpowiedz

Powiązane problemy