网站搜索

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 类仍然是一样的。