Question

我正在使用Angular构建表单。在我的表单中，有一种select作为标记。

以下是我的代码：

        <div class="form-group" ng-class="{ 'has-error': form.$submitted && form['{{field.id}}'].$invalid }" ng-if="field.type === 'select'">
            <select>
                    <div class="" ng-repeat="value in field.values">
                        <option value="">{{value.title}}</option>
                    </div>
            </select>
        </div>

这里是field.values的json文件：

 "values": [
                                {
                                    "id": 0,
                                    "title": "Not Selected"
                                },
                                {
                                    "id": 1,
                                    "title": "Yes"
                                },
                                {
                                    "id": 2,
                                    "title": "No"
                                }
                            ]

Javascript（所做的更改）：

app.controller（＆＃39; I129Ctrl＆＃39;，[＆＃39; $ scope＆＃39;，＆＃39; $ http＆＃39;，＆＃39; JSONModelsService＆＃39;， function（$ scope，$ http，JSONModelsService）{

    var formData = {};

    $scope.groups = [];
    $scope.sections = [];
    $scope.fields = [];

    //below is basically equivalent to routing
    JSONModelsService.get(['test', 'Valid Passport'])
        .then(function (response) {
            console.log(response);
            // $scope.group = response.data.groups[0];
            $scope.groups = response.data.groups;
            $scope.sections = $scope.groups.sections;
            $scope.fields = $scope.groups.sections.fields;
        });

基本上，我首先检查field.type是否等于select。如果是这样，我想要选择问题类型的值。但是，它没有像我想象的那样工作。我做错了什么？

Answer 1

首先不要在选择中使用div元素，但这不起作用。您可以将ng-repeat放在选项级别，但由于您没有与之绑定的ng-model，因此无法正常工作。

这样做的方法是选择标记中的指令ng-options。

<select ng-model="valueSelected" ng-options="value as value.title for value in field.values"></select>

如果您想让您的用户无法选择/取消选择某个值。添加选择以下选项：

<option ng-value="null">-- No value--</option>

选择标签与Anuglar无法正常工作

1 个答案: