Question

我有一个angularjs函数，其中包含一个如下所示的值数组

$scope.arrayVal = function()
{
var array = [{id:1,name:"one"},{id:2,name:"two"}];
}

我将此数组传递给html页面中的下拉列表，并按如下所示在下拉列表中显示值

<html>

<select ng-model="data.selected">
<option value="item.id,item.name" ng-repeat="item in array">{{item.id}} {{item.name}}</option>
</html>

我想要实现的是让用户从下拉列表中选择多个值，这些选定值应根据下拉列表下方的选定顺序显示。如何仅使用angularjs和html实现此目的。（我没有使用除angularjs之外的任何库）

Answer 1

选择此项以进行多项选择 https://www.w3schools.com/tags/att_select_multiple.asp

这可能也有帮助 How to get option text value using AngularJS?

Google是您的朋友；-）

Answer 2

尝试一下这个https://next.plnkr.co/edit/6Nxaxz9hGNXospyT。您可能需要修改它才能得到想要的结果

<div ng-controller="ctrl">
    <select ng-model="selectedItem" ng-options="item.name for item in items" ng-change="selectItem()">
    </select>
    <p ng-repeat="item in selectedItems">{{item.id}} - {{item.name}}</p>
</div>

angular.module('app', [])

.controller('ctrl', function($scope) {
  $scope.items = [{id:1,name:"one"},{id:2,name:"two"}];
  $scope.selectedItems = [];
  $scope.selectedItem;

  $scope.selectItem = function () {
    var index = $scope.selectedItems.findIndex(function (fItem) { return $scope.selectedItem.id === fItem.id; });
    console.log(index)
    if (index > -1) $scope.selectedItems.splice(index, 1);
    else $scope.selectedItems.push($scope.selectedItem);
  };
});

显示从列表中的下拉列表中选择的多个值

2 个答案: