Question

我正在使用ui-router，我正在解析一些我希望将解决方案注入我的自定义指令的数据，下面是代码我是怎么做的

 module portal {
           $stateProvider.state('portal', {
        url: '/demo',
        template: tpl.html,
        abstract: true,
        resolve: {

            demoResolve:function(){
                 return 'foo';//here i am returing a promise
        }
    });    

}


module portal.directives{


export class demoDirevtive{

    static $inject =['demoResolve'];
    constructor(demoResolve){
        console.log(demoResolve)
        var directive: ng.IDirective = {};
        directive.link = (scope, element, attrs, ctrl) => {

        };
        directive.restrict = "EAC";

        return directive;
    }
  }
}

但我收到了未知提供商的错误

Answer 1

从阅读他们的代码看起来似乎不太可能，他们有一个局部变量，他们注入到你在视图上定义的控制器，它也不能通过$ inject服务访问。

最简单的解决方案是将其放在控制器的范围内，然后在指令中使用它。

您还可以创建一个真实的服务，它将保存您应用程序中的所有已解析对象，即：

resolve: {
     demoResolve: ['myResolvingService', function(resolver) {
          resolver.myValue = 'Foo';
          return 'Foo';
     }]

我知道这不是你想要的，但它看起来并不像是支持它。

Answer 2

以下是如何通过控制器将解析值传递给指令的示例：

        .state('something.edit', {
            url: '/:id',
            template: '<something-edit title="title"></something-edit>',
            controller: function($scope, $title){
                $scope.title = $title;
            },
            resolve: {
                $title: ()=>{
                    return 'Something Edit';
                }
            }
        });

Answer 3

他们在2016年增加了对此的支持。

这是github线程：

https://github.com/angular-ui/ui-router/issues/2664#issuecomment-204593098

重要的部分是：

在0.2.19中我们将$ resolve添加到$ scope，允许你做“路由到组件模板”样式

模板：<my-directive input="$resolve.simpleObj"></my-directive>，

注入ui-router解析指令

3 个答案: