Angular JS 过滤器 - 如果新值为空，则不更新 DOM 值

Question

我正在处理一个数据量大的 Angular 项目，在该项目中我有一个 ng-repeat，其中每秒更新许多值。如果值为空，它现在更新 DOM 以显示空值；这是正确的行为。

需要解决方案

我想要的是一个过滤器或表达式，它在新值为空或 NULL 时不更新 DOM 中的值。锁定数据，我相信他们称之为。

可能的解决方案

我用 $watch 找到了几个可能的解决方案，但我认为它们不适合 ng-repeat，或者至少效率不高： angularjs $watch old value and new value are the same

我想要实现的示例：（这不起作用）

app.filter('latchIt', function () {
  return function (valueOld, valueNew) {
    if (valueNew == '') {
      // Do not update the DOM for this value, perhaps a return of the old value
      return valueOld;
    } else {
      return valueNew;
    }
  };
});

HTML

<div class="item" ng-repeat="item in items track by item.id">
  <div class="value" ng-repeat="value in item.data">{{ value | latchIt }}</div>
</div>

在此先感谢您给我的任何帮助和建议。

Answer 1

好吧，我会说 $watch 选项足以使用它，但如果您再次使用它，您可以尝试根据 controller/directive 中的业务规则组合旧集合值和新集合值，并且之后将其传递给查看。

Answer 2

我会为此创建一个指令：

代码笔：http://codepen.io/anon/pen/EVXgjz

angular.module('app').directive('latched', [function() {
  return {
    template: '<span>{{saved}}</span>',
    link: function($scope) {
      $scope.$watch('value', function(val) {
        if (!$scope.saved) {
          $scope.saved = val || 'Not defined yet';
        }
        if (val) {
          $scope.saved = val;
        } 
      })
    },
    scope: {
      value: '='
    }
  }
}])

Angular JS 过滤器 - 如果新值为空，则不更新 DOM 值

Angular JS filter - Do not update DOM value if new value is empty

javascript

dom

filter

angularjs

ng-repeat