使用多个 ng 重复构建表单如何处理数据? angular js

build a form using multiple ng repeats how to proccess the data? angular js

我在造一辆购物车。每个产品都有 "addons" 个,例如

这些"addons"来自数据库。并作为对象从 API 返回。

对象看起来像这样: 对象 cat_addons (addon_group) -对象(插件) -目的 - ETC 对象项目插件 (addon_group) -对象(插件) -目的 - 等等

现在我正在制作 "form" 至极显示 select 框和内容以及一个 "add" 按钮。现在,当用户单击 OK/add 我想要所有 selected 值,以便我可以进一步处理它......但现在我对此一无所知,因为 ng-model 必须是可变的,因为它是重复创建的。

所以我正在寻找一个选项来获取所有 selected 值形成一个(多)ng-repeat 填充形式我该怎么做?

查看:

<form ng-submit="addItemToCart()">
    <!-- ADDONS -->
    <!-- CAT ADDONS -->
    <div ng-if="cat_addons">
        <div ng-repeat="(k, addon_group) in cat_addons">
            {{addon_group.addon_group_name}}
            <!-- SINGLE OPTION-->
            <div ng-if="addon_group.addon_option_type == 'single'">
            <span>
                <select ng-options="addon.addon_name as addon.addon_id for addon in addon_group.items">
                    <!-- SHOWS NOTHING? -->
                </select>
            </span>
            </div>
            <!-- SINGLE OPTION -->

            <!-- MULTI OPTION-->
            <div ng-if="addon_group.addon_option_type == 'multi'">
            <span ng-repeat="(k, addons) in addon_group.items">
                <input type="checkbox" name="{{addons.addon_id}}">{{addons.addon_name}}
            </span>
            </div>
            <!-- MULTI OPTION -->
        </div>
    </div>
    <!-- CAT ADDONS -->
    <!-- ADDONS -->
    <button type="submit">ok</button>
</form>

控制器:

        $scope.addItemToCart = function() {
            //i have no clue...
        }

我理解在您发现它的功能后使用 ng-repeat 的冲动。但是 angular 还有很多东西可以让像这个问题这样的事情变得简单得多。您可能想探索 ngOptions 指令 (https://docs.angularjs.org/api/ng/directive/ngOptions) or the select tag (https://docs.angularjs.org/api/ng/directive/select).

如果这些不是您要查找的内容,请尝试阅读文档以探索 angular。我相信你会喜欢的。如果您仍然遇到困难,请对此答案发表评论,我会帮助您。我知道如何使用 ng-repeat 实现你想要的,但它甚至不是你想要做的最好的方式。