如何在对象文字中使用promise

Question

在angular-translate版本2.0中， $ translate服务不再返回实际的翻译，而是一个承诺。 我可以看到这是一个好主意，因为可能会有一些异步加载。 但它让我困惑如何在我的情况下正确使用服务，因为我在对象文字中使用了$ translate服务，就像这样

$scope.myDefs = [
      ...
      {
            field: 'supplier',
            displayName: $translate('Supplier'),
            cellTemplate: "<div class=\"ngCellText\">...</div>"
      },
      ...
      {
            field: 'supplierSize',
            displayName: $translate('Size'),
            width: 100,
            cellClass: "center"
      }
      ...
];

问题：如何在对象文字中使用promise？

它应该（根据文档 ）使用如下：

$translate('HEADLINE').then(function (headline) {
    $scope.headline = headline;
});

Answer 1

如果您知道没有异步内容，您可以使用$translate.instant() ，其行为与1.x中的$translate()完全相同。

Answer 2

你需要有一个直接的参考。 或者是一个对引用有封闭的辅助函数。 喜欢：

$scope.myDefs = [
    ...
    createArrayObject({
        field: 'supplier',
        displayName: $translate('Supplier'),
        cellTemplate: "<div class=\"ngCellText\">...</div>"        
    }),
    createArrayObject(.....

]

和其他地方

function createArrayObject(obj){
    obj.displayName.then(function(data){
       obj.displayName = data;
    });
    return obj;  
}

更新

正如Brian在下面所建议的，编写可以全部使用的通用代码总是一个好主意。

var forEach = angular.forEach,
    isFunction = angular.isFunction;

function resolveProperties(obj){
    forEach(obj,function(val,key){
        if(isFunction(val.then)){
            val.then(function(data){
                obj[key] = data;
            });
        }
    });
}

所以你可以像...一样使用它

[
    resolveProperties({
        myPropertyToResolve: promiseReturningFunction() 
    }),
    ....   
]

Answer 3

如果你使用ui-grid，解决方案是添加headerCellFilter：'translate'到columnsDefs（表示myDefs），displayName必须有翻译键。

这是，

 $scope.myDefs = [ { field: 'supplier', displayName: "Supplier", cellTemplate: "<div class=\\"ngCellText\\">...</div>", headerCellFilter: 'translate' }, { field: 'supplierSize', displayName: "Size", width: 100, cellClass: "center", headerCellFilter: 'translate' } ]; 

Answer 4

另一个想法是循环你的文字并用值替换所有的promises。 但是我不知道如果你已经解决了一个承诺，那么当你打电话时会发生什么。

angular.forEach($scope.myDefs, function(element){
   element.displayName.then(function(result){
      element.displayName= result;
   })
})