javascript - Angular 2 - Typescript 基础测试数据库类
我正在学习 Angular 2 并尝试一个沙盒项目,同时想知道如何在另一个类中使用一个类,就像在 Java 或其他面向对象的语言中那样。
如果我有一个像这样的类 MockDatabase:
export class MockDatabase {
constructor(private list: Restaurant[]){
this.list.push({ id: 1, name: "Chinese", tags: ["Chinese"] });
this.list.push({ id: 2, name: "Mexican", tags: ["Mexican"] });
this.list.push({ id: 3, name: "Italian", tags: ["Italian"] });
this.list.push({ id: 4, name: "American", tags: ["American"] });
}
getList(): Restaurant[] {
return this.list;
}
}
我想在服务类中像这样使用那个类:
@Injectable()
export class RestaurantsService {
constructor(private db: MockDatabase){
}
getAllRestaurants(): Restaurant[] {
return this.db.getList();
}
}
然后在这个组件中使用:
@Component({
selector: 'restaurants',
templateUrl: 'restaurants.html',
providers: [RestaurantsService, PreferencesFilterService]
})
export class RestaurantsComponent implements OnInit{
restaurants: Restaurant[];
constructor(
private restaurantsService: RestaurantsService,
private preferencesFilterService: PreferencesFilterService
) {}
ngOnInit(): void {
this.restaurants = this.restaurantsService.getAllRestaurants();
}
filterRestaurants(): void {
this.restaurants = this.preferencesFilterService.getFilteredRestaurants();
}
我收到一个错误提示“没有 MockDatabase 提供者”,但是如果我将它作为提供者添加到 RestaurantsComponent,我又会收到另一个错误提示“没有 Array() 提供者”,所以我认为我在这里做错了什么。
我相信我可能对在 Angular 2 中应该如何设计这样的东西有一个根本性的误解,因为我作为一个整体来说是网页开发的新手。
任何帮助或指引方向都会非常感激,因为我在网上很难找到好的资源。非常感谢您的时间。
答案#1
所以我在玩弄了一会儿之后解决了这个问题。我意识到在构造函数中有一个私有字段意味着它正在被注入,所以我必须在类中将其声明为常规实例变量。这就是现在的全部情况,对于任何有类似问题的人来说。
export class MockDatabase {
private list: Restaurant[]
constructor(){
this.list = new Array();
this.list.push({ id: 1, name: "Chinese", tags: ["Chinese"] });
this.list.push({ id: 2, name: "Mexican", tags: ["Mexican"] });
this.list.push({ id: 3, name: "Italian", tags: ["Italian"] });
this.list.push({ id: 4, name: "American", tags: ["American"] });
}
getList(): Restaurant[] {
return this.list;
}
}
和
@Injectable()
export class RestaurantsService {
private db: MockDatabase;
constructor(){
this.db = new MockDatabase();
}
getAllRestaurants(): Restaurant[] {
return this.db.getList();
}
}
RestaurantsComponent 类仍然是一样的。
