问题描述：

我有一周下拉式选择。我想要发生的是，当我更改下拉列表时，将运行$scope.disabled()方法。从而更改date.getDay() === 2日期的静态数字。基于日期选择禁用日期

你可以看到我想要做的$scope.disabled()函数的注释。

答案是否适合您？ – jme11

答

Updated Plunker

在您选择的元素，你使用ngOptions，这样你就可以使用表达式的选择为部分有使用设置为ID每个选项的值ng-options="day.id as day.name for day in daysOfWeek"。所以，现在，每当你改变select时，selectedDay的值就会被更新，并且一个摘要被启动。这意味着你不必看任何东西，你的禁用功能可以如下简化：

$scope.disabled = function(date, mode) { 
    var day = angular.isUndefined($scope.selectedDay) ? 0 : $scope.selectedDay; 
    if (mode === 'day' && date.getDay() === $scope.selectedDay) { 
    return true; 
    } 
    return; 
};

我添加了一个检查，以一天的值设置为的情况下，用户没有选择了天0，但你可以或者初始化选择与价值：

$scope.selectedDay = 0;

现在所有的作品，但有一个问题：日期选择器只运行呈现时其内部refreshView函数被调用禁用功能。我认为以编程方式触发datepicker刷新的最简单方法是更改其ng模型值。要做到这一点，我添加了一个功能：

$scope.triggerDate = function(date) { 
    $scope.dt = new Date(date); 
}

通过在选择元素的变化事件调用triggerDate，我们与当前选定的日期（所以我们不会改变价值可言）重置日期选择器的值，这足以强制刷新指令。因此，最终的选择如下所示：

<select class="form-control input-sm" ng-model="selectedDay" ng-options="day.id as day.name for day in daysOfWeek" ng-change="triggerDate(dt)"></select>

基于日期选择禁用日期

Updated Plunker

相关推荐