ng-change отримують нове значення та початкове значення


118

Я використовую ng-параметри для вибору значень із спадного меню. Я хотів би мати можливість порівняти старе значення з новим. ng-change працює добре, щоб схопити нове значення спадного, але як я можу отримати як нове значення, так і початкове значення?

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

Наприклад, скажімо, я хотів, щоб контролер увійшов: "Ваше колишнє ім'я користувача було BILL, ваше поточне ім'я користувача - PHILLIPE."


1
перевірити мою відповідь тут stackoverflow.com/questions/21909163/… може бути дублікатом
bresleveloper

не впевнений, як це працює адміністративно, але якимось чином відповіді з дубліката повинні бути об'єднані з цим. bresleveloper - приємне рішення (з дубліката), але TGH відповідь також повинна бути показана. Перший покладається на роботу фреймворка, який може змінитися в майбутньому, а другий - рамковий агностик.
користувач1821052

Відповіді:


279

За допомогою кутового {{вираз}} ви можете додати старе значення користувача або user.id до атрибута ng-change як буквальний рядок:

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

У ngChange 1-й аргумент updateValue буде новим значенням користувача, другий аргумент - літералом, який сформувався, коли тег вибору востаннє оновлений кутовим, зі старим значенням user.id.


6
Зауважте, що userвиклик методу - це виклик ng-model, а не з ng-опцій (може вводити в оману). Сподіваємось, це вишукане рішення буде працювати і в майбутніх версіях кутового :)
icl7126

15
Це слід вважати шкідливим. Я щойно натрапив на брудну помилку, що виникає, коли user.id містить спеціальний символ (наприклад, "або /). Це тому, що аналізатор розрізнень виразів не любить вираз, як updateValue (користувач," бла / бла ").
Антуан Банктел-Шеврел

2
У функції updateValue, $ range.user.id вже містить нещодавно вибране значення - немає необхідності передавати йому параметр для нового значення
Majix

@ LINQ2Vodka, я думаю, що це працює лише без лапок, якщо user.idцифра є ... вона не працюватиме, якщо user.idце рядок або настанова
Тамас

1
красиво :))))
Макатун

16

Також ви можете використовувати

<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
Ця відповідь справді добре працює з ng-повтором. Ви також можете використовувати ng-click, якщо елемент, який ви використовуєте, підтримує ng-change, але не ng-focus.
метько

1
ng-init = "oldValue = 0" & ng-focus = "oldValue = user.id" зробив для мене трюк.
thatzprem

14

Ви можете використовувати щось на зразок ng-change = someMethod ({{user.id}}). Зберігаючи ваше значення в стороні {{express}}, він оцінить вираз в рядку та надасть поточне значення (значення перед тим, як буде викликаний метод ng-зміни).

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

13

Просто зберігайте змінну currentValue у контролері, яку ви оновлюєте під час кожної зміни. Потім ви можете порівнювати це з новим значенням кожного разу перед оновленням. "

Ідея використання годинника також хороша, але я думаю, що проста змінна є найпростішим і логічним рішенням.


Дивитись - це дорога операція, мені сподобалась відповідь db-inf .. це просте робоче рішення
Pramod Sharma

4
Найкраща відповідь. Якщо ви знаходитесь у ng-повторі, створіть змінну в під-області, використовуючи ng-init.
Ромен Ф.

1
ІМХО це найкраща альтернатива. Оскільки вилучення старих значень не передбачено ngChange нестандартним, такі рішення, як це від @ db-inf, можуть застосувати наступні версії. Крім того, це звучить як відповідальність контролера, здається дивним делегувати його на шар перегляду.
Феліпе Лео

9

Ви можете скористатись переглядом:

$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
Я натрапив на статтю, в якій говориться, що дивитися набагато брудніше / неефективніше порівняно з ng-зміною. benlesh.com/2013/10/title.html
Меніос

5
З мого досвіду, ти майже ніколи не хочеш користуватися годинником
nardnob

2
Якби програмування було суб'єктивним мистецтвом, ви могли б там щось мати. На жаль - є багато причин, через які ви можете уникати ng-charge або інших підходів, заснованих на директиві, не пов'язаних із тим, щоб робити речі "кутовим" способом.
tommybananas

2

Ви можете використати годинник, тому що він має старе і нове значення, але потім ви додаєте до циклу дайджесту.

Я б просто зберегти другу контрольну змінну в контролері і встановити її.


Це досить тривіальний приклад, я б сприймав читабельність над тим, що турбуватися про одного спостерігача в цьому випадку. Я все-таки гарна річ, яку я повинен набридати.
tommybananas

1
Перегляд та зміни ng насправді мають різні способи поведінки: ng-зміна виявляє лише події користувача, тоді як $watchзапускається щоразу, коли змінна змінюється. Спостерігачі підвищують складність і схильні створювати цикли оновлення, коли код змінює свої значення.
Rhys van der Waerden

Я погоджуюся з @Rhys van der Waerden ... в цій статті йдеться, що $ watch трохи небезпечний: benlesh.com/2013/10/title.html
Меніоси
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.