指令中的 AngularJS 自定义过滤器以格式化值

AngularJS custom filter within directive to format value

本文关键字:格式化 过滤器 自定义 AngularJS 指令      更新时间:2023-09-26

我希望有一个指令来格式化它呈现的提供的值,并且此格式逻辑成为该指令的一部分,而不依赖于 HTML 属性或父控制器。

我对单个属性和标签的简化尝试如下所示,但给出了TypeError: definition.match is not a function错误。

app.directive('timeSpan', function() {
  scope: {
    value: '@value',
    displayValue: function(v) {
      return v / 1000.0;
    },
    displayUnits: function(v) {
      return 'seconds';
    },
    replace: true,
    template: '<span>{{value|displayValue}} {{value|displayUnits}}</span>'
  }
}
<time-span value="{{timer}}" />

我的解决方案是为您的指令创建一个控制器,并在该控制器中声明您的displayUnitsdisplayValue函数。

.directive('timeSpan', function() {
  return {
      scope: {
        value: '@value'
      },
      replace: true,
      template: '<span>{{displayValue(value)}} {{displayUnits(value)}}</span>',
      controller: 'TimeSpanCtrl',
  };
})
.controller('TimeSpanCtrl', ['$scope', function ($scope) {
    $scope.displayValue = function(v) {
      return v / 1000.0;
    };
    $scope.displayUnits = function(v) {
      return 'seconds';
    }
}]);

这篇文章中的类似问题