Question

我有一个问题列表，包括问题和答案，但用户将在我的选择中选择答案。我怎样才能做到这一点？我试过这个，但选择不会出现在屏幕上。

HTML：

<div ng-controller="mainController" class="container" style="margin-top: 10%">
        <div class="jumbotron">
            <div id="inicio">
                <h1 style="text-align: center">Ache aqui um filme perfeito para você assistir agora!</h1>
                <div class="center-block" style="margin-top: 30px">
                    <button ng-click="comecarPerguntas()" class="btn btn-success center-block" style="margin:0px auto;">Começar!</button>
                </div>
            </div>
            <div id="pergunta" ng-switch="pergunta" class="container">
                <div ng-switch-when="-1"></div>
                <div ng-switch-default>
                    <h2>{{perguntas[pergunta].pergunta}}</h2>
                    <select class="selectpicker">
                        <option ng-model="perguntas[pergunta].resposta">Sim</option>
                        <option ng-model="perguntas[pergunta].resposta">Não</option>
                    </select>
                </div>
            </div>
        </div>
    </div>

JS：

knnapp.controller('mainController', function ($scope) {
$scope.pergunta = -1;

$scope.perguntas = [
    {
        pergunta: "Você está feliz hoje?",
        resposta: ""
    },
    {
        pergunta: "Você está cansado?",
        resposta: ""
    },
    {
        pergunta: "Gosta de heróis?",
        resposta: ""
    }
];

$scope.comecarPerguntas = function () {
    angular.element(document.querySelector('#inicio')).css("display", "none");
    $scope.pergunta = 0;
};

}）;

Answer 1

ngModel应该在select元素上：

<select class="selectpicker" ng-model="perguntas[pergunta].resposta">
    <option value="yes">Sim</option>
    <option value="no">Não</option>
</select>

Answer 2

从角度文档中，这是实现select的适当方法：

<select ng-options="item.subItem as item.label for item in items track by item.id" ng-model="selected"></select>

来源： https://docs.angularjs.org/api/ng/directive/ngOptions

选择选项中的Ng模型

2 个答案: