AngularJS - ngOptions в избранном - как проверить до изменения модели?

Question

Im используя AngularJS. У меня есть select с несколькими вариантами. Чтобы работать с этими опциями, я использую ngOptions и ng-model. Когда значение в select изменилось, я делаю PUT operation. Если это удастся, то этот выбор должен быть передан модели. В случае неудачи модель не должна получать этот новый выбор.

<select class="form-control" ng-change="updateSelection(object)" 
ng-model="object.status" ng-options="status as label for (label, status) in CONSTANTS"> 
</select> 

Моя проблема заключается в том, что из-за ng-model и двухстороннее связывание, всякий раз, когда я делаю изменение новый выбор передается на модели без проверки. Есть ли способ сделать некоторые проверки перед обновлением модели?

Answer 1

Вы должны использовать только одну переменную для выбора (который присваивается ng-model) и одну переменную для конечного значения:

<select ng-change="updateSelection(object, selection)" 
     ng-model="selection" 
     ng-options="status as label for (label, status) in CONSTANTS"> 
</select> 

И в контроллере:

$scope.updateSelection = function(object, selection){ 
    $http.put(url, selection) 
    .then(function(data){ 
     object.status = selection; 
    }) 
    .catch(function(){ 
     selection = null; 
    } 
} 

EDIT:

Для более «правильного» подхода вы можете использовать асинхронный валидатор. Это может быть присоединено к любому входу с ng-model.

Вот пример поддельного валидатора с $timeout:

app.directive("fakeValidator", function($timeout, $q){ 
    return { 
    require: "ngModel", 
    scope: { 
     fakeValidator: "=" 
    }, 
    link: function(scope, element, attrs, ngModel){ 
     ngModel.$asyncValidators.fake = function(modelValue, viewValue){ 

     // don't invalidate empty values 
     if (!viewValue) { 
      return $q.when(true); 
     } 

     return $timeout(function(){ 
      // invalidate if the attribute value was false 
      return scope.fakeValidator ? true : $q.reject(); 
     }, 1000) 
     } 
    } 
    } 
}); 

недопустимые значения не распространяются на модели:

<select ng-model="object.status" fake-validator="false" 
     ng-options="status as label for (label, status) in CONSTANTS"> 
</select> 

plunker