3

假设我有一些具有相同原型的对象，并且我想自定义它们在 Angular 模板中的显示。我知道我可以创建自己的过滤器，然后像这样使用它：

<p>{{anObjectOfProtoP | myCustomFilter}}</p>

或附加到 $scope 的函数：

<p>{{myCustomFunction(anotherObjectOfProtoP)}}</p>

我的问题是：是否可以在不每次都明确指定渲染功能的情况下实现类似的功能？toAngularString理想的解决方案是，如果对 内部对象的函数进行角度检查{{}}，然后在模板中使用它的返回值。换句话说，我希望 Angular 做

function (o) {
   if (typeof o.toAngularString === 'function') return o.toAngularString();
   return o;
}

在里面的每一个物体上{{}}。

4

1 回答 1

4

根据您是使用{{ ... }}还是ng-bind语法，将调用对象上的.toJSON和函数来确定其表示形式。因此，您可以在对象的任一个或函数中.toString提供您想要的表示。.toString.toJSON

实际上，调用函数的这种差异导致了一些问题。

另一种方法是编写自己的指令my-toangularstr，如下所示：

app.directive('myToangularstr', function () {
  return {
    scope: true,
    template: '<span class="my-angular-value">{{ val.toAngularString() }}</span>',
    link: function (scope, elem, attrs) {
      scope.$watch(attrs['myToangularstr'], function (newVal) {
        if (typeof newVal !== 'undefined') {
          scope.val = newVal;
        }
      })
    }
  }
})

显示所有三种方法的工作演示在这里。

我认为这与使用 angular 的外部 API 所能达到的一样接近。

于 2013-11-02T17:29:01.430 回答