在 Ionic v1 中创建动态输入表单

Question

我在 Ionic v1 (Angular 1.x) 中有一个较旧的项目，用户可以在其中创建组和添加成员。我需要向应用程序添加一项功能，以便组管理员向组成员提问 - 一种动态表单。问题可以是三种类型 - 是/否（显示为切换）、字符串（输入文本）和带有选项的问题（显示为选择下拉菜单）。问题的数量可能会有所不同。

问题按照下面的哈希线存储。

{
        id1: {q: "question1", type: "String"},
        id2: {q: "question2", type: "Yes/No"}
        id3: {q: "question3", type: "Choice", choices: "Choice1, Choice2, Choice3"},
        id4: {q: "question4", type: "String"},
        id5: {q: "question5", type: "Yes/No"}
        id6: {q: "question6", type: "Choice", choices: "Choice4, Choice5, Choice6"}
}

我正在尝试想出最好的方式来动态地向用户展示这些问题并收集答案，但我不太确定什么是最好的方式来做到这一点。我开始考虑尝试创建指令，但想在花费太多时间之前获得建议。

期待您的想法和建议。

-S

Answer 1

我会建议一种比使用指令更简单的方法，除非您需要在多个视图中重用它作为组件。从ng-repeat="(key, value) in questions" 开始，其中questions 是您的对象的名称。然后根据value.type简单地显示/隐藏每个问题的不同形式：ng-if="value.type=='String'"...

您在每种情况下显示的表单将是yes/no 的复选框、string 的 textarea 或 input(type=text) 以及 choice 的单选按钮。

我没有提供完整的代码，因为我假设你知道足够多的 Angular 能够创建这些 - 如果不是每个案例都是一个简单的谷歌。您还需要在模型的每个问题上放置一个位置（即用户的答案），可能是value.answer。例如：

<input type="checkbox" ng-model="value.answer">

这有意义吗？