如何在日期字段中设置初始值或默认值？

Question

我正在尝试在 angularjs 和 bootstrap 中实现日期选择器，但我遇到了一些问题：

未设置初始日期
当我尝试打开一个日期选择器时，为什么它会打开所有日期选择器？

这是我的代码： http://plnkr.co/edit/elrOTfEOMmUkPYGmKTdW?p=preview

$scope.dateOptions = {
  maxDate: new Date(2020, 5, 22),
  minDate: new Date(1970,1,1),
  startingDay: 1
};
function disabled(data) {
 return true
}

$scope.open1 = function() {
  $scope.popup1.opened = true;
};

$scope.formats = ['dd-MMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
$scope.format = $scope.formats[0];
$scope.popup1 = {
  opened: false
};

为什么只点击一个日期选择器会打开所有日期选择器？见下图。

Answer 1

initial date is not set

这是因为您将模型设置为字符串，但它需要一个实际的日期对象。这样做：

date: {
  date: 'date',
  name: d // not this -> moment(d).format('DD-MMM-YYYY')
}

when I am trying to open one date picker why does it open all the date pickers?

由于您使用 ng-repeat 创建多个输入，您还需要为每个输入的 is-open 属性使用单独的属性。我建议在您要重复的项目中添加 opened 属性，如下所示：

date: {
  date: 'date',
  name: d,
  opened: false
}

然后，在按钮的点击事件上，传入重复项：

ng-click="open1(x)"

接下来，设置is-open属性：

is-open="x.opened"

最后，把opened属性设置成这样：

$scope.open1 = function(x) {
  x.opened = true;
};

Here is the plnkr.

如何在日期字段中设置初始值或默认值？

how to set initial value or default value in date field?

javascript

angularjs

angular-bootstrap