Question

我对提供商有些困难。我尝试在组件中导入新的自定义提供程序，但它不起作用。第二个提供商基于我制作的第一个提供商并且运作良好......

这是我的提供者：

import { Injectable} from "@angular/core";
import { Router, Routes } from '@angular/router';

import ... // All components needed

@Injectable()
export class RoutesHelper {

  private userRoutes: Routes = [
      { path: '' , component: HeaderComponent, outlet: 'header' },
      ...
    ];


  constructor(
    private router:Router
    ) {}

    public load() {
      this.router.resetConfig(this.userRoutes);
    }
}

这是我的“QuestionComponent”

import { Component, OnInit } from '@angular/core';
import { RoutesHelper } from '../_utils/routes.helper';

@Component({
  selector: 'questions-list',
  templateUrl: './app/question/questions.component.html',
  providers: [RoutesHelper]
})

export class QuestionsComponent implements OnInit {

  constructor(private routes:RoutesHelper) {}

  ngOnInit() {
    this.routes.load();
  }
}

但我有这个错误： “QuestionsComponent”的提供程序无效 - 只允许Provider和Type的实例，得到：[？undefined？]

我不知道为什么我得到“未定义”对象我也没有这个错误。

感谢您的帮助。

Answer 1

在app.module.ts文件中导入提供程序的链接。

导入{RoutesHelper}来自＆＃39;提供您的路径＆＃39;;

在app.module.ts提供者列表中包含提供者类名称。

提供商：[RoutesHelper，//您的其他提供商...]，

在QuestionComponent中只需导入RoutesHelper链接即可。无需定义提供者。

Answer 2

好的问题解决了。

以避免由于在组件中导入的提供程序中的导入组件导致的最后一个错误（所以递归导入）。我用过这个：

var userRoutes: Routes = [
    { path: '' , component: LeftComponent, outlet: 'left' },
    { path: '' , component: EmptyComponent, outlet: 'footer' },
    { path: '' , component: HeaderComponent, outlet: 'header' }
];

var all = userRoutes.concat(this.router.config);
this.router.resetConfig(all);

其中userRoutes仅包含我要覆盖的插座，它可以正常工作。

提供商无效

2 个答案: