javascript - AngularJS 的 ng-options 中正确的语法是什么？

Question

我从 rest-service 得到了一个数组，我正在尝试从该数据创建一个选项/下拉列表。

jsfiddle

$scope.reasons = [{
"languageLanguageId": {
    "languageId": 1,
    "lastUpdate": "2015-05-08T11:14:00+03:00",
    "name": "eng"
},
"returnText": "reason1",
"returnreasonId": 1}, {
"languageLanguageId": {
    "languageId": 1,
    "lastUpdate": "2015-05-08T11:14:00+03:00",
    "name": "eng"
},
"returnText": "reason2",
"returnreasonId": 2}, {
"languageLanguageId": {
    "languageId": 1,
    "lastUpdate": "2015-05-08T11:14:00+03:00",
    "name": "eng"
},
"returnText": "reason3",
"returnreasonId": 3

}];

HTML

<div class="col-md-10">
<select ng-model="reasons" ng-options="p.reason as (p.returnText + '('+p.returnreasonId+')') for p in reasons"></select>
</div>


<div class="col-md-10">
    <select ng-model="reasons" ng-options="p.returnreasonId as p.returnText for p in reasons"></select>
    </div>

Answer 1

您错过了 ng-app 和 Controller 声明:

<div ng-app>
   <div  ng-controller="TodoCtrl">
         <div class="col-md-10">
            <select ng-model="reason"  ng-options="p.returnreasonId as p.returnText for p in reasons"></select>
             {{reason}}
        </div>
    </div>
</div>

和 Controller :

function TodoCtrl($scope) {
$scope.reasons = [{
    "languageLanguageId": {
        "languageId": 1,
            "lastUpdate": "2015-05-08T11:14:00+03:00",
            "name": "eng"
    },
        "returnText": "reason1",
        "returnreasonId": 1
}, {
    "languageLanguageId": {
        "languageId": 1,
            "lastUpdate": "2015-05-08T11:14:00+03:00",
            "name": "eng"
    },
        "returnText": "reason2",
        "returnreasonId": 2
}, {
    "languageLanguageId": {
        "languageId": 1,
            "lastUpdate": "2015-05-08T11:14:00+03:00",
            "name": "eng"
    },
        "returnText": "reason3",
        "returnreasonId": 3
}];
}

编辑:

我犯了一个错误。在 ng-model 中，您将要存储所选值的位置放在哪里。在 ng-options 中，您可以放置​​所有可以选择的值。希望对您有所帮助。

http://jsfiddle.net/U3pVM/15559/

查看文档以获取更多信息:

https://docs.angularjs.org/api/ng/directive/select