Fonction fire ng-change sur l'option select tag

Question

J'ai une requête bizarre ici. S'il vous plaît se référer à cette jsFiddle

http://jsfiddle.net/ctbLparv/

<select ng-model="bob" ng-click="test()"> 
        <option value="5">5</option> 
        <option value="10">10</option> 
        <option value="15">15</option> 
</select> 

Comme vous pouvez le voir dans ce violon, j'ai des options et 15. Si 5,10 utilisateur sélectionne 10 ou 15, événement ng changement se déclenche et une alerte un message apparaît. Comme vous avez remarqué 5 est sélectionné par défaut ici et apparaît initialement. Et si je veux déclencher ng-change en sélectionnant 5 lui-même. Ça ne marche pas. Évidemment, cela ne marchera pas parce que nous sélectionnons la valeur 5 et que c'était la même valeur que précédemment. donc ng-change ne se déclenchera pas. Je comprends ce point.

mais j'ai un scénario, où je veux déclencher une fonction lorsque l'utilisateur sélectionne à nouveau la valeur par défaut. Quelqu'un peut-il m'aider s'il vous plaît dans ceci. PS-je ne peux pas utiliser ng-click parce qu'il déclenche l'événement dès que l'on clique sur les tags d'option lui-même. il ne vous permet donc pas de sélectionner dans une liste déroulante et déclenche immédiatement un événement.

Answer 1

Essayez d'utiliser ng-change pour appeler une fonction de votre automate qui examine l'option sélectionnée et détermine s'il s'agit de l'option par défaut. Chaque fois qu'un utilisateur sélectionne l'option par défaut, vous pouvez appeler n'importe quel code que vous souhaitez.

Exemple (HTML):

<select 
    ng-change='myChangeFunction()' 
    ng-model="mySelectedOption" 
    ng-options="myOptions"> 
</select> 

Exemple (JS):

$scope.myOptions = [ 
    { id: "5", name: "5" }, 
    { id: "10", name: "10" }, 
    { id: "15", name: "15" } 
]; 

$scope.myChangeFunction = function() { 
    if($scope.mySelectedOption.id === 5) { 
     // Default value has been selected, call your function 
    } 
}; 

Answer 2

ng-change/watch ne fonctionne que lorsque le modèle est modifié, vous pouvez également utiliser sélectionné ng- directive,

<select ng-model="bob" ng-selected="test()"> 

DEMO

Answer 3

Essayez de passer la valeur ng modèle à votre fonction.

HTML

<select ng-model="bob" ng-click="test(bob)"> 
    <option value="5">5</option> 
    <option value="10">10</option> 
    <option value="15">15</option> 
</select> 

Javascript

$scope.test = function (value) { 
alert ("changed to "+ value); 
} 

Answer 4

Probablement cela pourrait vous aider.

<select ng-model="bob" ng-change="test()"> 
    <option disabled value="">Select value ...</option> 
    <option value="5">5</option> 
    <option value="10">10</option> 
    <option value="15">15</option> 
</select> 

Ici, j'ai créé une autre option qui est désactivée et utilisée comme espace réservé pour sélectionner des options. Lequel vous pourriez ne pas avoir besoin de déclencher à nouveau l'option avec la valeur 5.

Veuillez vérifier dans le JSFiddle pour des doutes.

J'espère que cela vous sera utile. Je vous remercie.