Question

在我的Angular应用程序中，我的任务是向用户显示所有国家/地区的“选择多个”列表，并在进行多项选择后，能够确定选择了哪些国家/地区。

我理解如何在标签内部使用ng-repeat，但是，我不知道如何正确填充我的控制器中的$ scope.countries模型数组。（我唯一的猜测是将整个国家/地区列表放在数据库中，然后使用ng-init将所有记录推送到$ scope.countries数组，但我不确定这是否是执行此操作的最佳方法）我的第二个挑战是能够在选择一个或多个项目后迭代选择对象，并确定选择了哪个项目。目前，我的选择如下：

<div class="form-group">
                        <label for="selectbasic">What country is the data for</label>
                        <div>
                            <select type="text" class="form-control multiselect multiselect-icon" multiple="multiple"  ng-model="SelectedCountries">
                                <option ng-repeat="country in countries">
                                {{country.name}}
                                </option> 
                            </select> 
                        </div>
                    </div>

我的控制器看起来像这样：

$scope.countries = [
        {
            name: "US"
        },
        {
            name: "UK"
        },
        {
            name: "France"
        }
];

Answer 1

试试这个：http://jsfiddle.net/tarris/6S2Nk/

这是它的要点：

<div ng-app="myApp">
  <div ng-app="myApp" ng-controller="con">
    <div ng-repeat="item in countries">
        <input type='checkbox' ng-model="item.checked" />{{item.name}}
    </div>
    <button ng-click="checkit()">Check it</button>
  </div>
</div>

和javascript：

var myApp = angular.module('myApp', []);

myApp.controller('con', ['$scope', function($scope){
  $scope.countries = [
    {id:'us', name: 'United States', checked: false},
    {id:'fr', name: 'France', checked: false},
    {id:'sw', name: 'Sweden', checked: true}
  ];
  $scope.checkit = function(){
    var list = [];
    for(var p in $scope.countries){
        if($scope.countries[p].checked){
            list.push($scope.countries[p].name);
        }
    }
    alert(list);
  };
}]);

如何将所有国家/地区的列表填充到选择倍数，然后确定选择了哪些国家/地区

1 个答案: