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教程和参数属性似乎工作得很好，所以我想知道它是否与开发工具包有关，或者只是我传递的东西。我＆我＃39;对于Angular2来说是全新的，所以这可能是我的错误。谢谢你的帮助。

Answer 1

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

如果不使用，则无法为构造函数提供参数依赖注入（这会产生错误）;
不应该实例化类，但必须在此时调用引导程序，或通过路由器，或在Angular中传递它作为孩子通过指令。

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

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

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

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

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

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

您可以阅读更多here。

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

Angular2类构造函数错误：没有Number

1 个答案: