错误:[$ injector:unpr]带有打字稿服务的未知提供程序

时间:2015-12-22 10:18:47

标签: angularjs typescript

我有一个简单的服务,返回3个字符串(2个字符串可选)

module app.common {

interface IPageElementService {
    pageEl: app.domain.IPageSettings;
    setPageElements(title: string, subTitle?: string,icon?:string): 
                    app.domain.IPageSettings;
}

export class PageElementService implements IPageElementService {

    constructor(public pageEl: app.domain.IPageSettings) {
    }

    setPageElements(title: string, subTitle?: string,icon?:string): 
                    app.domain.IPageSettings {
        return this.pageEl = {
            title:title,
            subTitle:subTitle,
            icon:icon
       }
    }
}
angular.module("common.services").service("pageElementService", PageElementService);
}

这使用设置为

的pageSettings
module app.domain {
export interface IPageSettings {
    title     : string;
    subTitle? : string;
    icon?     : string;
}

export class PageSettings implements IPageSettings {
    constructor(public title     : string,
                public subTitle? : string,
                public icon?     : string
    ) {
    }
  }
}

然后将其添加到common.services自定义模块

 module app.common {
 angular.module("common.services", [
    "ngResource"
 ])
}

此模块已添加到主模块

module app {
  angular.module("app", [
    // Angular
    "ui.router",
    "ngMaterial",
    "ngAnimate",
    "ngMessages",
    "ngCookies",
    // Custom
    "common.services",
 ]);
}

但是我似乎无法在任何控制器中使用PageElementService并且我收到错误

Error: [$injector:unpr] Unknown provider: pageElProvider <- pageEl <- pageElementService

这没什么意义,因为我在该模块上有另一项服务,100%工作。

这是控制器

module app.home {
  interface IHomeModel {
      loader          : boolean;
      projectSettings : app.values.IProjectValues;
  }

  export class HomeCtrl implements IHomeModel {

      static $inject = ["$timeout","$state","pageElementService"];
      constructor(private $timeout       : angular.ITimeoutService,
                  private $state         : angular.ui.IStateService,
                  private pageElements   : app.common.PageElementService,
                  public loader          : boolean,
                  public projectSettings : app.values.IProjectValues
    ) {

        var vm = this;
        vm.loader = true;

        console.log(this.pageElements.setPageElements("Home"));

        $timeout(function () {
            vm.projectSettings = this.projectSettings;
            vm.loader = false;
        }, 500); 
    }
  }
  angular.module("app").controller("homeCtrl", HomeCtrl);
 }

2 个答案:

答案 0 :(得分:1)

您刚刚没有注册名为“pageEl”的服务(实现了app.domain.IPageSettings)。

module.service("pageEl", ...)

答案 1 :(得分:1)

注册服务PageElementService

.service("pageElementService", PageElementService);

需要其构造函数依赖

constructor(public pageEl: app.domain.IPageSettings) {

我们必须注册

export class PageSettings implements IPageSettings {
}
...
.service("pageEl", PageSettings);

而且,为了做好缩小准备,我们应该做

static $inject = ["pageEl"];
constructor(public pageEl: app.domain.IPageSettings) {

另一个解决方案,如何获取/创建IPageSettings,是手动的,而不是通过角色来的IoC。例如,如果我们知道所有设置(标题和子标题和图标),我们可以更改PageElementService的构造函数:

public pageEl: app.domain.IPageSettings;
//constructor(public pageEl: app.domain.IPageSettings) {
constructor(){
  this.pageEl = new PageSettings(....)
}

但正如评论所表达的那样 - 我们服务所要求的任何论据都必须在角度IoC中注册......