OnClick将项目从一个页面添加到另一页(离子2 Angular 2)

Question

我当前正在构建一个食谱应用程序，我想添加一个购物列表页面，您单击"添加到购物列表"按钮，它将在<ul>中列出的成分并发布它们在我想要的页面上，如果可能的话，需要将它们删除并尽可能完成。本质上是一个没有任何价格的购物车。

我的成分是从API（HTTP GET）中取出的，并如下打印。

<ul>
    <li *ngFor="let item of api?.ingredientLines">{{item}}</li>
</ul>

如果有人可以向我展示一个例子或帮助我，这将不胜感激。

Answer 1

您可以通过维护数据结构并将其作为参数传递到下一页/将其传递到本地存储中/提交到数据库中，然后从所需页面上拉出。<<

使用(click)='myFunc()'类型的代码单击该项目后，您将对此结构进行更改。

例如。

<ul *ngFor="let item of api?.ingredientLines">
    <li (click)='myFunc()>{{item}}</li>
</ul>

在您的myFunc()中，您可以操纵数据结构。例如。添加/维护属性，说addedToCart=true类型的代码。

非常简单。希望这可以帮助。如果您有任何细节可以帮助您进行具体细节。