来自模板的Angular JS调用函数,不属于范围

Question

这可能听起来很奇怪,但我有一个看起来像这样的转发器.

<tr ng-repeat="task in tasks">
    <td>{{getFriendlyDate(date)}}</td>
</tr>

我可以把这个函数放在这样的范围内.

$scope.getFriendlyDate = function(date){

    /* Code to convert ISO date to readable date */
    return date;

};

这工作正常,但我需要在许多模板中使用此功能,所以我不想将其复制并粘贴到许多控制器中.

一种选择是创建一个服务来执行此操作并在每个控制器的范围上放置一个简单的包装器,但这不会节省我很多时间.

另一种选择是将函数放在根作用域上并直接在我的模板中访问它,但我更喜欢它存在于我的实用程序库中(我有一个使用工厂创建的$ utils库).

我想知道是否可以直接从模板调用服务来进行日期转换？

Answer 1

听起来你想要一个过滤器.创建一次过滤器:

angular.module("myModule").filter('friendlyDate', function() {
     return function(date) {
          /* Code to convert ISO date to readable date */
          return date;
     };
});

然后在你的HTML中随处可见:

<tr ng-repeat="task in tasks">
    <td>{{date | friendlyDate}}</td>
</tr>