2015-06-19 14 views
5

AngularJS ile oluşturduğum bir web sitesinde angular-typeahead kullandığım bir typeahead ile bir giriş var. Chrome, Opera ve Safari'de çalışıyor ancak Firefox'ta çalışmıyor. Sorun, Firefox'ta modelin öneri önerisini tıkladığımda güncellenmemesi gibi görünüyor.ng-model neden Firefox'ta Typeahead ile güncellenmiyor?

Benim html şöyle görünür:

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

ve benim denetleyicisi bu basit işlevi vardır: Krom, Opera ve Safari'de

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

o userId için bir int kaydeder, ancak içinde Firefox, sadece undefined'u kaydeder.

Ne demek istediğimi göstermek için plunker for it here yaptım ("one" veya "two" için arama).

Chrome, Opera ve Safari'de çalışır, ancak Firefox'ta bir şekilde konsola undefined gösterir. Ekstra garip olan şey, sadece ilk kez undefined göstermesidir. Eğer ikinci bir şey seçerseniz, işe yarıyor.

Neden bunun Firefox'ta çalışmadığını ve en önemlisi bunu nasıl çözebileceğimi biliyor mu? Tüm ipuçları bekliyoruz!

+0

Plunker'ınızı Chrome ve FF'de denedim. Her ikisi de iyi çalışıyor gibi görünüyor. Modelin, FF'de TypeAhead'in dışındaki bir tıklama ile "seçili" olamayacağı zamanlar vardır.Yani model doğru bağlı, ama sonra bağlı değil. Seçimle "Gönder" Düğmesine bastığım an, başka bir seçim yapana kadar bu hata tekrar görüntülenmeyecek. –

+0

@DaveAlperovich - Pekala, Firefox'u kullanırken modelin nasıl seçilebileceğini biliyor musunuz? – kramer65

+0

Henüz değil. Çok garip davranışlar. Model Ayrıştırıcı işten atılıyor, bir şekilde tıklama olayı bir özet döngüsünü başlatıyor (zaten tek sayı) ve bir değer için geçerli dizin kullanıyor. Her ikisi de çok tuhaf. Buna karşılık gelen bir sınır olayı bulamıyorum. –

cevap

4

Bu ilginç bir ikilemdi.

  • özeti döngüsü çalışır bir kez (tıklama gibi) herhangi bir olay üzerine

  • seçilen bir nesneye ng-model değerini belirlertypeahead, çerçeve modeli değeri a atama bağlanma ng-model zorlar string girişe bağlı.

  • FireFox, aksine Krom bu çalışma biçimini zorunlu görünmektedir. Krom girişleri, muhtemelen nesne değeri ayarına izin verir (sadece tahmin).

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

    outputval bizim beklenen değerdir:


etrafında çalışma çıktı bağlayıcı değiştirmektir. Yönergenin bir model bağlaması beklediği ve kullandığı için rastgele bir kapsam değişkenine a bağladım.

Yönergenin içinde, seçili değeri scope.outputval olarak ayarlamak için updateScope işlevini değiştirdim ve atamayı Model'e ekledim.

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; 
     }); 
    } 

benim Plunker deneyin!