12
<input type="text" id="exampleab"
ng-model="a.b"
ui-event="{ blur : 'callScriptThenServer()' }" >

由于某些原因ng-change,文本框无法正常工作,所以我正在使用它;使用 Angular-ui 的ui-events.

问题

我只想在值发生更改并且还想要回调中的旧值时才调用该函数。(因为我想将 oldValue 发送到服务器)。

我不想通过纯指令路线,因为这些出现太多了

NG-CHANGE:每改变一个字符,我都会收到一个回调。我不想要那个。我需要使用文本框中的旧值和模糊后的新值调用服务器脚本..

4

4 回答 4

17

你可以观察你的变量同时拥有 newValue 和 oldValue。

<input type="text" id="exampleab" ng-model="a.b"  >

在您的控制器中:

app.controller('ctrl', function ($scope) {
    $scope.$watch('a.b', function (newValue, oldValue) {
        console.log('oldValue=' + oldValue);
        console.log('newValue=' + newValue);
        //do something
    });
});

JSFiddle

编辑 您在编辑中提到了一个新要求,所以我编辑了我的答案。你不应该使用 ng-change。您应该在控件获得焦点时获取 oldValue 并将其保存在变量中,然后在 blur 事件中获取新值。 我设置了一个新的小提琴。

在您的控制器中:

    app.controller('ctrl', function ($scope) {
        $scope.showValues = function () {
            alert('oldValue = ' + $scope.oldValue);
            alert('newValue = ' + $scope.a.b);
        }
    });

我你的看法

<input type="text" id="exampleab" ng-model="a.b" ng-init="oldValue = ''" ng-focus="oldValue = a.b" ng-blur="showValues()" />{{a.b}}
于 2014-01-03T16:45:23.053 回答
10

使用 ng-model-options

<input type="text" ng-model="a.b" ng-change="callScriptThenServer()" ng-model-options="{updateOn: 'blur'}"/>
于 2014-05-16T15:24:16.753 回答
2

您可以使用AngularJS 手表

$scope.$watch(function(){
    return $scope.a.b;
}, function(newvalue, oldvalue){
    //Here You have both newvalue & oldvalue
    alert("newvalue: " + newvalue);
    alert("oldvalue: " + oldvalue);
},true);

Plunkr 演示

于 2014-01-03T16:44:18.123 回答
0

使用 Angular ngModelOptions 和 getterSetter:true; 然后在函数的“set”部分使用方法调用。

请参阅此页面上的最后一个示例: https ://docs.angularjs.org/api/ng/directive/ngModelOptions

于 2015-02-20T10:34:38.753 回答