Question

非常简单的问题，但不确定如何解决它

我有重复，重复模型视频。

模型有一个选定的值，我想在下拉列表中看到它：

<div data-ng-repeat="singleVideo in model.videos">
    {{singleVideo}}<select data-ng-model="singleVideo.name" ng-options="item.name for item in videoList"></select>
</div>

这是视频模型：

$scope.model = {
                 videos:[
                    {id:1,name:"VIDEO_ONE"},
                    {id:2,name:"VIDEO_TWO"}
                ]
            }

这是videoList项目：

$scope.videoList = [
                {id:1,name:"VIDEO_ONE"},
                {id:2,name:"VIDEO_TWO"},
                {id:3,name:"VIDEO_Three"}
            ];

我希望看到第一个下拉值设置为VIDEO_ONE 第二个下拉值将设置为VIDEO_TWO。

目前，下拉列表为空。

我怎样才能做到这一点？

This is the expected result, currently i'm getting the dropdown boxes empty

Answer 1

您只需要使用item.id as item.name for item in videoList为ng-options设置值。见下面的代码。

（我将 id 设置为值，因为我认为它更适合。在某处您还需要根据 id <更新您的name属性/ strong>。或副verca。您的选择。）

＆＃13;
＆＃13;
angular.module('testapp', []) .controller('appCtrl', function($scope) { $scope.model = { videos:[ {id:1,name:"VIDEO_ONE"}, {id:2,name:"VIDEO_TWO"} ] }; $scope.videoList = [ {id:1,name:"VIDEO_ONE"}, {id:2,name:"VIDEO_TWO"}, {id:3,name:"VIDEO_Three"} ]; });
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="testapp"> <div ng-controller="appCtrl"> <div ng-repeat="singleVideo in model.videos"> {{singleVideo.name}} <select ng-model="singleVideo.id" ng-options="item.id as item.name for item in videoList" ng-selected="true"></select> </div> </div> </body>
＆＃13;
＆＃13;
＆＃13;

Answer 2

<div data-ng-repeat="singleVideo in model.videos">
    {{singleVideo}}<select data-ng-model="singleVideo.name" ng-options="item.name as item.name for item in videoList"></select>
</div>

ng-repeat中的AngularJS ng-option

2 个答案: