Question

我有一个使用AngularJS，Monaca和OnsenUI开发的跨平台应用程序。

我的一个观点是大表单，用户可以在其中选择多个下拉选择值。对于表单的很大一部分，选项可以是Yes / No下拉选择选项。

我已在 app.js 中创建了一个数组，以保留“是/否”选项以填充下拉选择值，如下所示。

$scope.OptionYesNo = [{
    yesnooptiondesc: "No",
    yesnooptionid: "0"
}, {
    yesnooptiondesc: "Yes",
    yesnooptionid: "1"
}];

然后填充我的下拉选择选项，我在视图中执行以下操作：

<ons-row>
    <ons-col>
        Option 1
        <select id="" name="" ng-model="OptionYesNo.yesnooptionid" ng-options="yesNoOption.yesnooptionid as yesNoOption.yesnooptiondesc for yesNoOption in OptionYesNo" ng-change="changedValue(OptionYesNo.yesnooptionid, 'OptionOne')">
            <option value="" label="-- Please Select --"></option>
        </select>
    </ons-col>
</ons-row>

然后在我的 app.js 中，我处理 changedValue（...）函数中所选值选项的更改，如下所示。我将一个标识符传递给函数以及一个指向哪个数组以保存值的指示符（省略因为不相关）

$scope.changedValue = function (selectedValue, identifier) {
    switch (identifier) {
        case "OptionOne":
            $scope.optionOneArray.push(selectedValue);
            break;

        case "OptionTwo":
            $scope.optionTwoArray = selectedValue;
            break;
    }
}

问题是当我尝试使用与上面相同的方法添加第二个是/否选项时，例如

<ons-row>
    <ons-col>
        Option 2
        <select id="" name="" ng-model="OptionYesNo.yesnooptionid" ng-options="yesNoOption.yesnooptionid as yesNoOption.yesnooptiondesc for yesNoOption in OptionYesNo" ng-change="changedValue(OptionYesNo.yesnooptionid, 'OptionTwo')">
            <option value="" label="-- Please Select --"></option>
        </select>
    </ons-col>
</ons-row>

每当我更改一个选择值时，另一个也会改变，因为它们使用相同的ng模型。我该如何处理这种情况？我不想（或者我认为必须）创建一个 $ scope.Option 一个 YesNo = [{...}]; $ scope.Option 两个 YesNo = [{...}]; 用于每个选择下拉列表，因为可能有20多个选择下拉列表。

Answer 1

这可能会指向正确的方向。您可以重复选择数组。在我使用的一个运作良好的例子中：

 <select class="form-control" ng-model="user.gefunden" ng-required="true" ng-init="user.gefunden = gefunden[0]" ng-options="o as o for o in gefunden">
                                    </select>

Gefunden是控制器中的数组。

Answer 2

您需要在视图中为下拉列表创建不同的ng模型。不要在所有下拉列表中使用相同的模型。您仍然可以在每个下拉列表中迭代$ scope.optionsyesno中的选项。这应该可以解决问题。

使用相同的ng-model从AngularJS中的数组中选择下拉选项

2 个答案: