Question

你好我有一个数组，我想在bootstraps工具提示中显示它的元素我有以下代码行：

<a   style="color:green;"data-toggle="tooltip" data-placement="top" title="{{el.ingredientLines[0]}}">{{el.ingredientLines.length}} </a>

我需要遍历整个数组instad中挑选每个元素[0] [1]等，ng-repeat不会帮助我，因为它会重复el.ingredientLines.lenght多次，因为数组有元素，所以基本上我需要这个结果： http://prntscr.com/hvhx4g

Answer 1

我认为你将数组中所有项目的总数（el.ingredientLines.length）与特定项目的数量混合在一起。你应该在项目中引入新的财产“金额”或类似的东西。

this.el.ingredientLines.push({
  "name": "Dark Chocolate Tafy",
  "amount": 4
});
this.el.ingredientLines.push({
  "name": "Dark Beer...",
  "amount": 6
});

然后在视图中，你会迭代这样的东西：

<a *ngFor="let ingredientLine of el.ingredientLines"  style="color:green;"data-toggle="tooltip" data-placement="top" title="{{ingredientLine.name}}">{{ingredientLine.amount}} </a>

编辑：在第二次阅读时，我看到你的目标是别的。您希望迭代项目名称并在工具提示中列出所有项目名称。然后在课堂上引入新的变量：

export class xComponent {
   private tooltipOutput: string;
...
ngOnInit(): void {
   this.tooltipOutput = "";
   for (let ingredientLine of el.ingredientLines) {
      this.tooltipOutput += ingredientLine + ", ";
   }
   this.tooltipOutput && (this.tooltipOutput = this.tooltipOutput.slice(0, -2));  // this is to remove final ", "
}

然后在视图中：

<a   style="color:green;"data-toggle="tooltip" data-placement="top" title="{{tooltipOutput}}">

将所有元素从数组显示到bootstrap工具提示中

1 个答案: