2013-06-02 14 views
10

AngularJs (1.0.7) 'deki bir sözden tek bir kayıt döndürme ve sonucu bir forma bağlama girişiminde bulunuyorum. Form doğru şekilde bağlanır, ancak giriş alanları salt okunurdur - Değerleri düzenleyemiyorum.

Bunun yerine kaydı bir Array içine sardım ve ng: yineliğini kullanarak yineleyin, form doğru şekilde bağlanır ve değerleri düzenleyebilirim. Açıkça sorunu gösteren bir plnkr oluşturduk

:

http://embed.plnkr.co/fOWyhVUfekRbKUSRf7ut/preview

doğrudan bağlı ve liste bağlı giriş alanlarını düzenleyebilir

Ancak tek vaadi bağlı alan düzenlenemez.

ng: modelini bir sözden dönen bir nesneye doğrudan bağlamak mümkün mü yoksa bu iş için bir dizi kullanmam gerekiyor mu?

app.controller('MainCtrl', function($scope, $timeout, $q) { 

    var person = {"name": "Bill Gates"} 

    var deferList = $q.defer(); 
    var deferSingle = $q.defer(); 

    // Bind the person object directly to the scope. This is editable. 
    $scope.direct = person;  

    // Bind a promise to the scope that will return a list of people. This is editable. 
    $scope.list = deferList.promise; 

    // Bind ap romise to the scope that will return a single person record. This is *not* editable. 
    $scope.single = deferSingle.promise; 

    // Resolve the promises 
    $timeout(function(){ 
    deferList.resolve([person]); // Array 
    deferSingle.resolve(person); // Just the record itself 
    }, 100); 


}); 


<body ng-controller="MainCtrl"> 
    Directly Bound - This field is editable 
     <input ng:model="direct.name"/> 
    <hr/> 
    Singleton Promise - This field is *not* editable. 
     <input ng:model="single.name"/>  
    <hr/> 
    List Promise: - This field is editable 
     <div ng:repeat="person in list"> 
      <input ng:model="person.name"/> 
     </div> 

</body> 

Düzenleme: Model direktifi değere ('$$ v') sözünün bileşeni, gelen okuma ama sözünü doğrudan yazıyor: Bazı ayıklama sonra, ben ng olduğunu tespit ettik nesnenin kendisi. Sözcüğü düzenlemeye çalışırken, sözün karakterini saklarken ViewModel özgün değerine geri döndürülmeye devam eder. Böylece kullanıcı giriş alanına 'asdf' yazarsa, sonuç aşağıdaki gibi olur.

{Name: "Asdf", $$v: {Name: "Bill Gates"}} 

yerine ben yanlış mı yapıyorum

{$$v: {Name: "asdf"}} 

bekliyor ya angularjs bu potansiyel bir hata olduğunu gerektiğinden?

(Daha açık olarak, meselenin bir Array ve bir söz tarafından döndürülen bir nesne arasındaki davranış farkıdır. Direkt bağlanma bir kontrol olarak sadece orada)

+0

Sorunu buldum ve bir çekme isteği oluşturduk. https://github.com/angular/angular.js/pull/2854 –

cevap

8

GÜNCELLEME

olduğunu görünüyor AngularJS 1.0.3: http://jsfiddle.net/sonicsage/k8W4Y/6/

Sorun AngularJS 1.0.2'ye geçerseniz, işe yarayacaktır.

açık sorunu GitHub'dan var: https://github.com/angular/angular.js/issues/1827

Google Groups orijinal iplik.

otomatik burada unwrapping ilgili ilginç bir iş parçacığı da var:

> $('body.ng-scope').data('$scope').single 
Object {then: function, $$v: Object} 
$$v: Object 
then: function (b,g){var j=e(),h= 
__proto__: Object 
: https://github.com/angular/angular.js/pull/1676


Krom konsolunda uygulamayı ayıklama ederek, single bir fonksiyonu (vaadi) olduğunu görebilirsiniz

direct ürünü bir nesnedir:

> $('body.ng-scope').data('$scope').direct 
Object {name: "Bill Gates", $$hashKey: "004"} 
: UI üzerinde hiçbir etkisi yoktur Ancak, her ne salt okunur giriş tuşlara basarak, tüm metin ve silme seçerek, örneğin, promise üzerinde bir etkisi vardır , mülk üzerinde bir etkisi vardır ayrıca, sözü edilen uygulamayı debug

: http://run.plnkr.co/plunks/rDo7bFZlBq4rRH2ZNJn1/

DÜZENLEMEYİ

IMO doğrudan bir alana bir söz fol olarak kodu değiştirmeden, (bu resmen belgelenmiştir?) desteklenmez bağlama alçaklar çalışacaktır:

// Bind ap romise to the scope that will return a single person record. This is *not* editable. 
    deferSingle.promise.then(function(data) { 
     $scope.single = data; 
    }, function(data) { 
     // error 
    }); 

İşte plunker var: http://run.plnkr.co/plunks/rDo7bFZlBq4rRH2ZNJn1/

+0

oops, Cevabımı gönderdikten sonra düzenlemenizi gördüm. AngularJS hatası olup olmadığından emin değilim. –

+0

Teşekkürler. Desteklenen bağlanma olayı hakkında% 100 emin değilim - ancak hemen hemen her durumda doğru çalışıyor ve parse.js'de unwrapping $$ v işlemek için özel bir kod var. –

+0

Açıkçası doğrudan bağlama çalışmaları, özellikle de dikkati çeken şey, bir 'Array' işine dönen sözün, ancak bir Sözlüğü döndüren sözün olmamasıdır. Doğrudan bağlanma, kontrol olarak eklenmiştir. –