Динамически связывать ng-модель с неизвестным типом ввода

0

У меня есть HTML-форма, где у меня есть несколько вопросов с разными типами ответов. Например, в вопросе 1 есть ответ типа multi флажок, вопрос 2 имеет тип ответа ответа, вопрос 3 имеет тип ответа текстовой области. Может быть "n" количество вопросов с любым из вышеуказанных типов. Используя ng-repeat, я могу отображать вопросы по HTML.

Теперь проблема состоит в том, чтобы прочитать ответы, заполненные пользователем. Мне нужно отправить ответ на отправку формы. Я не могу понять, как привязать ng-модель к каждому вопросу.

<form id="SubmitForm" name="SubmitForm" class="form-horizontal" role="form">
        <div ng-repeat="question in questions">
                <div class="col-sm-10">
                    <span>{{$index+1}}.   {{question.question}}</span>

                    <div ng-if="question.optionType.id == '1'"><!-- Multiple Choice -->
                        <div class="checkbox" ng-repeat="option in question.options | split track by $index">
                          <label><input name="{{question.id}}" type="checkbox" value="" ng-model="answer_question.id">{{option}}</label>
                        </div>
                    </div>
                    <div ng-if="question.optionType.id == '2'"><!-- radio button -->
                        <div class="radio" ng-repeat="option in question.options | split track by $index">
                            <label>
                                <input type="radio" name="{{question.id}}">
                                    {{option}}
                                <br>
                            </label>
                        </div>
                    </div>
                    <div ng-if="question.optionType.id == '3'"><!-- text box -->
                        <textarea rows="5" name="{{question.id}}"></textarea>
                    </div>
                </div>
        </div>

        <div class="form-group" align="center">
                <button id="completeSurvey" name="completeSurvey" class="btn btn-info" ng-click="complete()"><span class="glyphicon glyphicon-ok-sign"></span> Done</button>
        </div>
    </form>

Как я могу собрать все данные, введенные пользователем, и использовать их в методе "complete()"?

Теги:

2 ответа

1

Из-за двухстороннего привязки к AngularJS вам действительно не нужно ничего делать.

Поскольку пользователь обновляет любой из входов, связанных ng-model с базовой моделью данных, Angular позаботится о синхронизации.

Вы можете просто называть ng-click='complete(questions)' и вы получите самый последний и самый большой пользовательский вход для полной функции.

0

В ваших <input> и <textarea> просто добавьте ng-model="question.answer". Затем вы можете получить доступ к ответам через каждое свойство ответа на вопрос.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню