Javascript 角度-如何使用不同的数据重复组件？

我有一个Angular 2应用程序，我想列出我数据中的所有位置（我使用我的服务拉入）

在我的父母中，我计划用*ngFor列出他们：

<ul *ngFor="let location in myservice.locations"></ul>

html将类似于：

{{location.locationname}}
{{location.locationdate}}

我的主要问题是，我如何确保构建我的位置组件，以便它可以与多个数据对象重用，并且可以循环使用它们

谢谢！！如果我能澄清，请告诉我。

。我想这就是你要找的

我路过

  [{
    id: 'location 1'
  },{
    id: 'location 2'
  }]

---

使用

*ngFor

循环到子组件，其中每个对象都可以根据组件进行渲染

首先，从端点接收的数据将存储在this.obj（代码：this.obj=data）中，然后可以存储在html中

<ul *ngFor="let location in obj">
  <li>{{location.locationname}}</li>
  <li>{{location.locationdate}}</li>
</ul>

{{location.locationname}
{{location.locationdate}

---

这将为每个位置显示两行

我认为您可以使用

@Input

将数据传递给子组件。我不明白主要问题是什么。你介意创建一个stackblitz exmaple并与我们分享吗！我明白这是怎么回事了。我的服务出错了。我在导入'of/observable'时遇到问题，并收到以下消息：模块'/filepath/node_modules/rxjs/Rx''has no exported member'的'I missing something'？谢天谢地！找到答案：@LaurenAH干杯！：）

<ul *ngFor="let location in obj">
  <li>{{location.locationname}}</li>
  <li>{{location.locationdate}}</li>
</ul>