angular2:缺少的“详细视图”服务教程

Question

几乎所有教程都展示了如何创建检索数据的服务，如下所示

[
  {"id":1, "name":"cat"}, 
  {"id":2, "name":"dog"}, 
  {"id":3, "name":"cow"}, 
  ...
] 

并展示了组件如何使用*ngFor使用此类服务。

但是如果我想要基于其中一个选择来获得更多的数据，那该怎么办呢？例如，我从上面的'list service‘中选择了dog，使用*ngFor selection来调用一个'detail service’，比如

[
  {
    "id":2, 
    "name":"dog", 
    "species": "canine", 
    "weight": "2-100kg",
    "height": "10-100cm", 
    "smell": "good", 
    "character" : "great", 
    ... 
  }
]

我要在详图构件上使用它。

我如何“消费”这样的服务?一个单独的条目的*ngFor感觉不正确，特别是我可能想在模板的完全不同的区域中显示不同的部分，而不是在<li>列表中。

Answer 1

您可以添加馈送结构的select操作。

<select [ngModel]="selectedOption" (ngModelChange)="onChange($event)" name="sel">
    <option [value]="i" *ngFor="let i of options">{{i}}</option>
</select>