deshabilitar - La lista desplegable de selección de Firefox sigue actualizando/volviendo a la opción predeterminada debido a la ejecución de Javascript-AngularJS
habilitar o deshabilitar un input con javascript (4)
Estoy creando una aplicación en AngularJS y tengo problemas para seleccionar menús desplegables al usar Firefox.
Cuando hago clic en un menú de selección y muevo el cursor sobre las opciones, restablece la opción seleccionada, desde la que mi cursor está sobre, a la opción predeterminada / primera. Cuando el número de opciones es grande, resulta muy difícil seleccionar la opción correcta.
La aplicación requiere JavaScript para actualizar la pantalla cada segundo, y esta parece ser la causa.
Sin embargo, parece que no tengo este problema con Chrome o Safari.
¿Hay alguna manera de resolver esto para Firefox?
index.html
<!DOCTYPE html>
<html ng-app="myapp">
<head>
<script data-require="[email protected]" data-semver="1.0.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<link href="style.css" rel="stylesheet" />
<script src="script.js"></script>
</head>
<body ng-controller="ctrl">
<div ng-init="updatetimer()">
<div>seconds: {{counter}}</div>
<select ng-model="something" ng-options="n.name for n in namelist">
<option value="">select person</option>
</select>
</div>
</body>
</html>
script.js
var app = angular.module(''myapp'', []);
var ctrl = [''$scope'', ''$timeout'', function($scope, $timeout) {
$scope.counter=0;
$scope.namelist = [
{name: "Name1"}, {name: "Name2"}, {name: "Name3"}, {name: "Name4"}, {name: "Name5"},
{name: "Name6"}, {name: "Name7"}, {name: "Name8"}, {name: "Name9"}, {name: "Name10"},
{name: "Name11"}, {name: "Name12"}, {name: "Name13"}, {name: "Name14"},
{name: "Name15"}, {name: "Name16"}, {name: "Name17"}, {name: "Name18"},
{name: "Name19"}, {name: "Name20"}, {name: "Name21"}, {name: "Name22"},
{name: "Name23"}, {name: "Name24"}, {name: "Name25"}, {name: "Name26"},
{name: "Name27"}, {name: "Name28"}, {name: "Name29"}, {name: "Name30"}
];
$scope.updatetimer = function() {
var updater = function() {
$scope.counter++;
$timeout(updater, 1000);
}
updater();
};
}];
Algunas personas todavía se enfrentarán a este problema.
Aquí está la solución:
if (existingOption.id !== option.id) {
lastElement.val(existingOption.id = option.id);
}
-if (existingOption.element.selected !== option.selected) {
+if (existingOption.selected !== option.selected) {
lastElement.prop(''selected'', (existingOption.selected = option.selected));
}
} else {
Agregue este parche directamente en el núcleo angular. Este error aún persiste en v1.2.8
Eso es un problema de la versión anterior de AngularJS básicamente anterior a la 1.0.7, se ha corregido en la versión 1.0.7, si usas una versión anterior a la 1.0.7, obtendrás el mismo problema.
Parece que la creación de los elementos de ''opción'' a través de ng-options es la causa raíz de este problema.
He alterado un poco el código para asegurarme de que ese sea el problema
Ver el plunkr
http://plnkr.co/edit/DLf2wvVGXRiwci6FhqQO?p=preview
Lo que he hecho es mover la lógica de creación de las opciones a ng-repeat . Eso solucionará el problema por ahora.
Por favor actualiza el angularjs a v1.2.15