Angular 如何将数据传递到ng引导popover

我正在编写一个带引导的Angular应用程序，使用ng引导。我将popover封装在如下组件中：

HTML（popover组件）

数据1:{v.data1}
数据2:{v.data2}

此popover在另一个组件中打开：

HTML

打开

---

我需要将ngFor的v参数传递给popover。我怎样才能做到这一点呢？

这是角度测量的基本技术

因此，您需要更新您的popover组件：

popover.component.html

<div>
  <div>Data 1: <i>{{ data.data1 }}</i></div>
  <div>Data 2: <i>{{ data.data2 }}</i></div>
</div>

然后更新您的NGF，以便：

<div *ngFor="let v of vector">
  <span [ngbPopover]="popOver" popoverTitle="Pop title">Open</span>
  <ng-template #popOver>
    <popover [data]="v"></popover>
  </ng-template>
</div>

打开

---

下面是一个示例

只需将@Input添加到您的popover组件中，您可以给我一个示例吗？您没有提供组件代码。这是基本的角度技术，组件代码就是上面的html。不，你提供的是模板，不是组件代码。

<div>
  <div>Data 1: <i>{{ data.data1 }}</i></div>
  <div>Data 2: <i>{{ data.data2 }}</i></div>
</div>

@Component({
  selector: 'popover',
  templateUrl: './popover.component.html'
})
export class PopoverComponent {
  @Input() data: any;
}

<div *ngFor="let v of vector">
  <span [ngbPopover]="popOver" popoverTitle="Pop title">Open</span>
  <ng-template #popOver>
    <popover [data]="v"></popover>
  </ng-template>
</div>