Angular2类构造函数错误：没有Number的提供程序

Question

我使用这里的开发工具包开始了一个项目： https ： //github.com/datatypevoid/ng2-mean-webpack 。 一切似乎工作得很好，除非我创建一个带有参数属性的新类（如官方的Typescript文档中所示： https ：//www.typescriptlang.org/docs/handbook/classes.html），我收到错误控制台中的消息说：

ORIGINAL EXCEPTION: No provider for Number!

这是我的班级：

@Component({
  selector: 'grid-tile',
  template: require('./grid-tile.component.html'),
  styleUrls: [require('!style!css!sass!./grid-tile.component.scss')],
  providers: [],
  directives: [],
  pipes: []
})
export class GridTile extends Tile {
  constructor(private x:number, private y: number) {
    super();
  }
}

以下是我创建实例的方法：

var tile = new GridTile(3,4);
tiles.push(tile);

我非常希望在进一步开发的过程中找到解决这个问题的方法。 我已经按照Angular2 Tour of Heroes教程和参数属性似乎工作得很好，所以我想知道它是否与开发工具包有关或者只是我正在传递的东西..我对Angular2完全是新的所以这可能是我的错误。 谢谢您的帮助。

Answer 1

Angular 2使用MVC模式：用@Component修饰的@Component等同于Controller。 这意味着：

• 如果不使用依赖注入（这会产生错误），则无法为构造函数提供参数;

• 该类不应该被实例化，但必须在引导时或通过路由器调用，或者在Angular中通过指令将其作为子项传递。

如果你仔细分析英雄之旅 ，你会发现你创建了一个服务，这是一个注射类：

@Injectable()
export class HeroService {
  ...
  }
}

然后将其作为provider （在同一组件或父级中）注入，并通过将其传递给组件的构造函数来实例化：

@Component({
  selector: 'my-app',
  ...
  providers: [HeroService]
})
export class AppComponent implements OnInit {
  ...
  constructor(private heroService: HeroService) { }
  ...
}

通过这种方式，对注入类的引用由组件和所有子组件继承。

在您的示例中，您有两个变量作为参数，并且生成错误，因为它们不对应于组件中的任何提供程序。

你可以在这里阅读更多。

或者，开始： http ： //victorsavkin.com/post/118372404541/the-core-concepts-of-angular-2