ng-değişim yeni değer ve orijinal değer al


118

Bir açılır listeden değerleri seçmek için ng seçeneklerini kullanıyorum. Eski değeri yeni değerle karşılaştırabilmek istiyorum. ng-change, aşağı çekmenin yeni değerini yakalamak için iyi çalışıyor, ancak hem yeni değeri hem de orijinal değeri nasıl elde edebilirim?

<select ng-change="updateValue(user)" ng-model="user.id" ng-options="user.id as user.name for user in users"></select> 

Örneğin, denetleyicinin "Önceki kullanıcı.adınız BILL, mevcut kullanıcı adınız PHILLIPE" günlüğünü kaydetmesini istediğimi varsayalım.


1
cevabımı burada kontrol edin stackoverflow.com/questions/21909163/… yinelenebilir
bresleveloper

bunun idari olarak nasıl çalıştığından emin değilim, ancak bir şekilde kopyadan gelen yanıtlar bununla birleştirilmelidir. bresleveloper güzel bir çözümdür (kopyadan) ancak TGH yanıtı da gösterilmelidir. Birincisi, gelecekte değişebilecek çerçevenin çalışmasına dayanırken, ikincisi çerçeveden bağımsızdır.
user1821052

Yanıtlar:


279

Açısal bir {{ifade}} ile eski kullanıcı veya user.id değerini ng-change özniteliğine değişmez bir dize olarak ekleyebilirsiniz:

<select ng-change="updateValue(user, '{{user.id}}')" 
        ng-model="user.id" ng-options="user.id as user.name for user in users">
</select>

NgChange'de, updateValue için 1. bağımsız değişken yeni kullanıcı değeri olacaktır, 2. bağımsız değişken, eski user.id değeri ile seçme etiketi açısal olarak en son güncellendiğinde oluşturulan değişmez değer olacaktır.


6
Not userÇağırılırken den biri ng-model, ve NG-seçenekler arasından (yanıltıcı olabilir). Umarım bu zarif çözüm, gelecekteki angular :) sürümlerinde de işe
yarar

15
Bunun zararlı olduğu düşünülmelidir. User.id özel bir karakter içerdiğinde ortaya çıkan kirli bir hatayla karşılaştım ('veya /). Bunun nedeni, Angular ifade ayrıştırıcısının updateValue (user,' blah / blah ') gibi ifadelerden hoşlanmamasıdır.
Antoine Banctel-Chevrel

2
UpdateValue işlevinde, $ kapsam.user.id yeni seçilen değeri zaten içeriyor - yeni değer için ona bir parametre geçirmeye gerek yok
Majix

@ LINQ2Vodka, bence sadece user.idsayısal ise tırnak işaretleri olmadan çalışır ... user.idbir dizge veya kılavuz ise işe yaramaz
Tamas

1
güzel :))))
Makatun

16

Ayrıca kullanabilirsiniz

<select ng-change="updateValue(user, oldValue)"     
       ng-init="oldValue=0"
       ng-focus="oldValue=user.id"
       ng-model="user.id" ng-options="user.id as user.name for user in users">
</select>

1
Bu cevap ng-tekrar için gerçekten işe yarar. Bunu kullanmakta olduğunuz öğe ng değişimini destekliyorsa ancak ng-odaklamıyorsa, bunun yerine ng-tıklamayı da kullanabilirsiniz.
meticoeus

1
ng-init = "oldValue = 0" & ng-focus = "oldValue = user.id" benim için hile yaptı.
thatzprem

14

Ng-change = someMethod ({{user.id}}) gibi bir şey kullanabilirsiniz. Değerinizi {{ifade}} tarafında tutarak, satır içi ifadeyi değerlendirecek ve size mevcut değeri verecektir (ng-değiştirme yöntemi çağrılmadan önceki değer).

<select ng-model="selectedValue" ng-change="change(selectedValue, '{{selectedValue}}')">

13

Denetleyicinizde her değişiklikte güncellediğiniz bir currentValue değişkeni bulundurun. Daha sonra her güncellemeden önce bunu yeni değerle karşılaştırabilirsiniz. '

Saat kullanma fikri de iyi ama bence basit bir değişken en basit ve en mantıklı çözüm.


İzle biraz pahalı bir işlem, db-inf'in cevabını beğendim .. basit bir çalışma çözümü
Pramod Sharma

4
En iyi cevap. Bir ng tekrarının içindeyseniz, ng-init kullanarak alt kapsamda bir değişken oluşturun.
Romain F.

1
IMHO bu en iyi alternatiftir. Eski değerlerin alınması, kullanıma hazır olarak ngChange tarafından sağlanmadığından, @ db-inf'deki gibi çözümler gelecek sürümlerde patlayabilir. Ayrıca, bu bir denetleyicinin sorumluluğu gibi geliyor, onu görüntüleme katmanına devretmek garip görünüyor.
Felipe Leão

9

Bir osiloskop saati kullanabilirsiniz:

$scope.$watch('user', function(newValue, oldValue) {
  // access new and old value here
  console.log("Your former user.name was "+oldValue.name+", you're current user name is "+newValue.name+".");
});

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch


6
Saatin ng-değişimine göre çok daha kirli / verimsiz olduğunu belirten bir makaleye rastladım. benlesh.com/2013/10/title.html
Menios

5
Deneyimlerime göre neredeyse hiç saat kullanmak istemezsiniz
nardnob

2
Programlama öznel bir sanat olsaydı, orada bir şeye sahip olabilirsiniz. Ne yazık ki, işleri "açısal" şekilde yapmakla ilgisi olmayan, ücret veya diğer direktif temelli yaklaşımlardan kaçınmak isteyebileceğiniz birçok neden vardır.
tommybananas

2

Bunun yerine bir saat kullanabilirsiniz, çünkü bu eski ve yeni değere sahiptir, ancak o zaman özet döngüsüne eklersiniz.

Denetleyicide ikinci bir değişken tutup bunu ayarlardım.


Bu oldukça önemsiz bir örnek, bu durumda tek bir izleyici için endişelenmek yerine okunabilirliği ele alıyorum. Sanırım yine de yorgun olmak iyi bir şey.
tommybananas

1
Watch ve ng-change aslında farklı davranışlara sahiptir: ng-change yalnızca kullanıcı olaylarını algılar, oysa $watchdeğişken her değiştiğinde tetiklenir. Gözlemciler karmaşıklığı artırır ve kod değerlerini değiştirdiğinde güncelleme döngüleri oluşturmaya eğilimlidir.
Rhys van der Waerden

@Rhys van der Waerden'e katılıyorum ... bu makale $ watch'un
Menios
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.