处理AngularJS中的转换数据

Question

我有一个时间戳列表.我可以用AngularJS列出它们.但是我想将其列为日期字符串.那些日期字符串应该是可编辑的 - 当它完成时我想要更新相关的时间戳.

我的第一个问题是:AngularJS以不同格式(过滤器？)呈现项目的方式是什么,并且仍然具有双向数据绑定？(模块,指令,听众？)

谢谢

Answer 1

如果您的可编辑数据是原始数据(时间戳),则应使用过滤器.

但是如果你希望它可以在日期字符串格式中编辑,那么你需要创建一个指令来增加ngModel+input,通过添加自定义$parsers和$formatters.

这很简单:

app.directive('dateFormat', function() {
  return {
    require: 'ngModel',
    link: function(scope, element, attr, ngModelCtrl) {
      ngModelCtrl.$formatters.unshift(function(valueFromModel) {
        // return how data will be shown in input
      });

      ngModelCtrl.$parsers.push(function(valueFromInput) {
        // return how data should be stored in model
      });
    }
  };
});

在您的HTML中:

<input type="text" ng-model="date" date-format />

该指令将要求ngModelController您可以增强其行为.

做了一个Plunker.当然,如果您需要简单的日期操作,请考虑在指令中以编程方式使用Filters,因此您不必重复已经实现的过滤器.我在Plunker中使用它,所以你可以看到如何使用它.