Angular 4 在从 JSON API 加载数据时保存数据并设置新页面答案

【问题标题】：Angular 4 saving data and setting new page while loading data from a JSON APIAngular 4 在从 JSON API 加载数据时保存数据并设置新页面
【发布时间】：2017-09-18 16:49:05
【问题描述】：

我在使用 JSON API 和 Angular 时遇到问题

    <div class="col-lg-12">
        <div *ngFor="let Questionnaire of struc.data; let i = index">
          <span>{{i}}.  {{Questionnaire.attributes.content.question}}</span>
        </div>
    </div>

<!--Radio button answers -->

    <div class="col-lg-2" *ngFor="let ans of Questionnaire.attributes.content.answers;let j = index">
         <label class="radio-inline"><input type="radio"  name="answ" [value]="j" >{{ans}}</label>
    </div>

所以我在 angular 的帮助下将调查从我的 JSON API 加载到我的网站。现在我的问题是目前有 122 个问题。使用 ngFor 加载答案时，单选按钮的名称都相同，因此只能对 122 个问题给出一个答案：

问题：

是否可以给单选按钮起一个在下一个问题开始时自动计数的名称？

问题：

是否可以在从 API 加载 5 个问题后开始新页面，还是我必须将所有 122 个问题发布到同一页面？

希望有人知道该怎么做。谢谢！

【问题讨论】：

您可以使用*ngFor 中的索引为单选按钮分配唯一名称

标签： json angular api

【解决方案1】：

我建议您创建一个用于显示问题/答案的组件，比如说“PollComponent”，并通过服务处理服务器通信，即发布用户选择的选项等。该组件的输入将是一个问题 ID。另一个组件将负责获取您的 122 个问题 ID 并根据所选 ID 呈现“PollComponent”。

它类似于 Angular 2 中的 TODO 应用程序，如此处所示。 https://github.com/tastejs/todomvc/tree/master/examples/angular2

【讨论】：