Angularjs多选日期选择器数组

Question

我通过在tr元素中使用ng-change和ng-repeat来创建一个简单的多选择，而没有扩展ui-bootstrap。我能够选择多个日期并将所有日期推入一个表数组。但是删除项目的splice()和清空数组的pop()根本不起作用。

这是通过扩展bootstrap plnkr来支持多选的链接。有限公司/iVSdXt

我的控制器:

angular.module('app', ['gm.datepickerMultiSelect'])
.controller('AppCtrl', function() {
  this.activeDate;
  this.selectedDates = [new Date().setHours(0, 0, 0, 0)];
  this.type = 'individual';
  this.identity = angular.identity;
  this.removeFromSelected = function(dt) {
    this.selectedDates.splice(this.selectedDates.indexOf(dt), 1);
  }
});

Answer 1

检查工作演示:Plunker

首先，ng-change要求ng-model:

注意，这个指令需要ngModel存在。

你的错误来了:

指令'ngChange'要求的控制器'ngModel'找不到!

添加ng-model:

<tr ng-repeat="d in frompickers" ng-model="selectedDate" 
    ng-change="fromdatepickers(calDate)">

其次，将控制器修改为:

angular.module('app', [])
  .controller('AppCtrl', function($scope) {
    $scope.frompickers = [];
    $scope.remove = function(index) {
      $scope.frompickers.splice(index, 1);
    }
    $scope.reset = function() {
      while ($scope.frompickers.length > 0) {
        $scope.frompickers.pop();
      }
    };
    $scope.fromdatepickers = function(calDate) {
      var cdate = new Date(calDate);
      $scope.frompickers.push(cdate);
    };
  });

在您的代码中，您在函数$scope.fromdatepickers中定义$scope.frompickers = [];，该函数每次都会创建一个新数组。所以数组总是只有一个成员