Perché il mio modello ng non si aggiorna con Typeahead in Firefox?

Question

In un sito Web che sto creando con AngularJS Ho un input con un typeahead qui sotto per il quale utilizzo angular-typeahead. Funziona bene in Chrome, Opera e Safari ma non in Firefox. Il problema sembra essere che in Firefox il modello non si aggiorna quando faccio clic sul suggerimento typeahead.

mio html assomiglia a questo:

<input class="typeahead" sf-typeahead type="text" datasets="userDataset" ng-model="searchUser" > 
<button ng-click="sendToUser(searchUser.id)" class="btn">Send</button> 

e nel mio controller ho questa semplice funzione:

$scope.sendToUser = function(userId){ 
    console.log(userId); 
    // More code here.. 
} 

In Chrome, Opera e Safari si registra un int per il userId, ma in Firefox registra solo undefined.

Ho creato uno plunker for it here per indicare cosa intendo (cercare "uno" o "due").

Funziona in Chrome, Opera e Safari, ma in Firefox in qualche modo mostra undefined nella console. La cosa più strana è che mostra solo undefined la prima volta. Se selezioni qualcosa una seconda volta, funziona.

Qualcuno sa perché questo non funziona in Firefox e, cosa più importante, come posso risolverlo? Tutti i suggerimenti sono ben accetti!

Answer 1

Questo è stato un dilemma interessante.

• il typeahead imposta il valore ng-model a un oggetto, una volta selezionato

• Su ogni caso (come click) che gestisce il ciclo di digest, il quadro fa rispettare la ng-model vincolante, assegnando il valore del modello di stringa legata all'input.

• FireFox, a differenza di Chrome sembra rispettare questo comportamento. Gli ingressi di Chrome consentono probabilmente l'impostazione del valore dell'oggetto (solo un'ipotesi).

---

Il lavoro attorno è quello di cambiare l'output vincolante:

<input class="typeahead" sf-typeahead type="text" datasets="userDataset" 
outputval="searchUser" ng-model="a" options="exampleOptions"> 

Il outputval è il nostro valore atteso. Mi sono associato a una variabile di ambito casuale a perché la direttiva prevede e utilizza un'associazione modello.

All'interno della direttiva, ho modificato la funzione updateScope per impostare il valore selezionato su scope.outputval e ho commentato l'assegnazione a Modello.

function updateScope (object, suggestion, dataset) { 
     scope.$apply(function() { 
     var newViewValue = (angular.isDefined(scope.suggestionKey)) ? 
      suggestion[scope.suggestionKey] : suggestion; 
     console.log(newViewValue);  
     //ngModel.$setViewValue(newViewValue); 
     scope.outputval = newViewValue; 
     }); 
    } 

Prova il mio Plunker!