Question

我正在尝试将<td>中的旧值与最终用户输入的新值进行比较。我正在使用ng-blur来检测何时焦点离开字段而不是调用该函数。问题是我不能让这个非常简单的逻辑工作，我无法弄清楚原因。

这是我的表：

<main ng-controller="mainCtrl">
    <table class="table table-bordered table-hover" ng-controller="tableCtrl">
        <p ng-model="old">{{old}}</p>
        <thead>
        <th>user name</th>
        <th>script name</th>
        <th>cron format<span class="glyphicon glyphicon-question-sign"  data-toggle="tooltip" data-original-title="Min|Hour|Day Of Month|Month|Day Of Week"></span></th>
        </thead>
        <tbody ng-repeat="(user_id,script_id) in data">
        <tr ng-repeat="(script_id, cron_format) in script_id">
            <td class="userName">{{user(user_id)}}</td>
            <td class="scriptName">{{script(script_id)}}</td>
            <td class="cronFormat"><input type="text" ng-model="cron_format" ng-blur="saveCron(user_id,script_id,cron_format)"/></td>
        </tr>
        </tbody>
    </table>

这是比较：

$scope.old = $scope.cron_format = "";

$scope.saveCron(user_id, script_id, cron_format) {
    if ($scope.old == $scope.cron_format) {
        return; //value was unchanged
    }
        $.post("updateCronChange.php", "user_id=" + userId + "&script_id=" + scriptId + "&cron_format=" + cronFormat, function (data) {
            alert('cron format changed to:' + cronFormat);
        });
    $scope.old = $scope.cron_format;
});

目前，每次字段失焦时都会执行该功能。我在这里缺少什么？

Answer 1

您可以在ng-init的每次迭代中使用ng-repeat来存储旧值，然后在函数中使用它进行比较：

<tr ng-repeat="row in data" ng-init="oldCron = row.cron_format">

在函数调用中：

ng-click="saveCron(row.user_id,row.script_id,row.cron_format,oldCron)"

最后在函数内部：

$scope.saveCron = function(userId,scriptId,cronFormat,oldCron){
        console.log("old cron: " + oldCron);            
        console.log("new cron: " + cronFormat);            
        if (oldCron != cronFormat) {

            //assign
        }

    }

Fiddle

Answer 2

如果我理解正确，您正在尝试保存旧值并将其打印出来。您可以尝试将其更改为 -

if ($scope.old != $scope.cron_format) {
   $.post("updateCronChange.php", "user_id=" + userId + "&script_id=" + scriptId + "&cron_format=" + cronFormat, function(data) {
     alert('cron format changed to:' + cronFormat);
  });
  $scope.old = $scope.cron_format;
}

如果您愿意，这是一个有效的例子 -

＆＃13;

var test = angular.module('test', []);

test.controller('TestCtrl', ['$scope',
  function($scope) {
    $scope.myModel = '';
    $scope.old = '';
    $scope.getNewValue = 'false'

    $scope.saveModel = function(value) {
      if ($scope.old != value) {
        $scope.getNewValue = 'true';
        $scope.old = value;
        $scope.myModel = '';
        // Here you can do your post request
      } else {        
        $scope.getNewValue = 'false';
      }
    };

  }
]);

＆＃13;

.green {
  color: green;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>
<div ng-app='test'>
  <div ng-controller="TestCtrl">Enter Some Text
    <input type="text" ng-model="myModel" ng-blur="saveModel(myModel)">
    <p>Old Value - {{old}}</p>
    <p>Current Value - {{myModel}}</p>
    <p class="green">Get New Value - {{getNewValue}}</p>
  </div>
</div>

＆＃13;

比较角度中的旧VS新变量

2 个答案: