Angular 2 错误:提供者无效 - 仅允许提供者和类型的实例,得到:[object Object] [英] Angular 2 Error: Invalid provider - only instances of Provider and Type are allowed, got: [object Object]

查看:23
本文介绍了Angular 2 错误:提供者无效 - 仅允许提供者和类型的实例,得到:[object Object]的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在将 ui-router2 与 angular2-rc-4 集成,但我得到了

<块引用>

错误:无效的提供者 - 只允许提供者和类型的实例,得到:[object Object]

以下是引导代码

<预>从ui-router-ng2"导入{trace、UIROUTER_PROVIDERS、UIView、UIRouterConfig、Category、UIROUTER_DIRECTIVES};从@angular/http"导入{HTTP_PROVIDERS};从@angular/core"导入{provide, PLATFORM_DIRECTIVES};从@angular/common"导入 {LocationStrategy, HashLocationStrategy, PathLocationStrategy, PlatformLocation};从@angular/platform-b​​rowser"导入{BrowserPlatformLocation};导入 'rxjs/add/operator/toPromise';导入 'rxjs/add/operator/map';从'@angular/common'导入{APP_BASE_HREF};import { disableDeprecatedForms, provideForms } from '@angular/forms';从@angular/core"导入 { enableProdMode };从'@angular/platform-b​​rowser-dynamic'导入{引导};从 './app.routes' 导入 { InitialStates };从 './app.component' 导入 { AppComponent };从./_bootstrap/router.config"导入{MyUIRouterConfig};if ('' === 'prod') { enableProdMode();}trace.enable(Category.TRANSITION, Category.VIEWCONFIG);引导程序(UIView,[disableDeprecatedForms(),提供表单(),初始状态,{提供:APP_BASE_HREF,使用价值:''},提供(位置策略,{useClass:HashLocationStrategy}),提供(位置策略,{useClass:PathLocationStrategy}),提供(平台位置,{ useClass:BrowserPlatformLocation }),...UIROUTER_PROVIDERS,...HTTP_PROVIDERS,提供(UIRouterConfig, { useClass: MyUIRouterConfig }),提供(PLATFORM_DIRECTIVES,{useValue:[UIROUTER_DIRECTIVES],多:真})]);

以下是我的路由器配置.

import {UIRouter} from "ui-router-ng2";从../app.routes"导入{InitialStates};从@angular/core"导入 {Injectable, Injector};@Injectable()导出类 MyUIRouterConfig {构造函数(私有注入器:注入器){}配置(uiRouter:UIRouter){//向 StateRegistry 注册每个状态定义(来自 app.states.ts)InitialStates.forEach(state => uiRouter.stateRegistry.register(state));//定义一个默认行为,当 URL 不匹配路由时uiRouter.urlRouterProvider.otherwise(() => uiRouter.stateService.go("app", null, null) && null);}}

解决方案

如果你这样写,会抛出同样的错误:

{ provider: MyService, useValue: myServiceMock }

取而代之的是:

{ 提供:MyService,useValue:myServiceMock }

注意providerprovide 之间的区别.正确的是provide.

希望这会有所帮助.

I am integrating ui-router2 with angular2-rc-4 but i am getting

Error: Invalid provider - only instances of Provider and Type are allowed, got: [object Object]

Following is the bootstraping code


    import {trace, UIROUTER_PROVIDERS, UIView, UIRouterConfig, Category, UIROUTER_DIRECTIVES} from "ui-router-ng2";
    import {HTTP_PROVIDERS} from "@angular/http";
    import {provide, PLATFORM_DIRECTIVES} from "@angular/core";
    import {LocationStrategy, HashLocationStrategy, PathLocationStrategy, PlatformLocation} from "@angular/common";
    import {BrowserPlatformLocation} from '@angular/platform-browser';
    import 'rxjs/add/operator/toPromise';
    import 'rxjs/add/operator/map';

    import { APP_BASE_HREF } from '@angular/common';
    import { disableDeprecatedForms, provideForms } from '@angular/forms';
    import { enableProdMode } from '@angular/core';
    import { bootstrap } from '@angular/platform-browser-dynamic';

    import { InitialStates } from './app.routes';
    import { AppComponent } from './app.component';
    import {MyUIRouterConfig} from "./_bootstrap/router.config";

    if ('' === 'prod') { enableProdMode(); }

    trace.enable(Category.TRANSITION, Category.VIEWCONFIG);

    bootstrap(UIView, [
        disableDeprecatedForms(),
        provideForms(),
        InitialStates,
        {
          provide: APP_BASE_HREF,
          useValue: ''
         },


         provide(LocationStrategy, { useClass: HashLocationStrategy }),

         provide(LocationStrategy, { useClass: PathLocationStrategy }),
         provide(PlatformLocation, { useClass: BrowserPlatformLocation }),

        ...UIROUTER_PROVIDERS,
        ...HTTP_PROVIDERS,

        provide(UIRouterConfig, { useClass: MyUIRouterConfig }),

        provide(PLATFORM_DIRECTIVES, {useValue: [UIROUTER_DIRECTIVES], multi: true})
    ]);

Following is my router config.

import {UIRouter} from "ui-router-ng2";
import {InitialStates} from "../app.routes";
import {Injectable, Injector} from "@angular/core";

@Injectable()
export class MyUIRouterConfig {
  constructor(private injector: Injector) {}

  configure(uiRouter: UIRouter) {
    // Register each state definition (from app.states.ts) with the StateRegistry
    InitialStates.forEach(state => uiRouter.stateRegistry.register(state));

    // Define a default behavior, for when the URL matched no routes
    uiRouter.urlRouterProvider.otherwise(() => uiRouter.stateService.go("app", null, null) && null);
  }
}

解决方案

The same error is thrown for a simple typo, if you write this:

{ provider: MyService, useValue: myServiceMock }

Instead of this:

{ provide: MyService, useValue: myServiceMock }

Note the difference between provider and provide. The correct is provide.

Hope this helps.

这篇关于Angular 2 错误:提供者无效 - 仅允许提供者和类型的实例,得到:[object Object]的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆