Angular Bootstrap datepicker - 禁用日期

M B*_*M B 2 angularjs angular-ui-bootstrap

我有一个带disabledDates功能的AngularUI Bootstrap日历

<uib-datepicker ng-model="date" ng-change="change()"  date-disabled="disabledDates(date,mode)"></uib-datepicker>
Run Code Online (Sandbox Code Playgroud)

这是功能:

 $scope.disabledDates = function (date, mode) {
                if ($scope.daysAvailable != null) {
                    return mode === 'day' && $scope.daysAvailable.indexOf(date.getDay() + 1) == -1;
                }
            }
Run Code Online (Sandbox Code Playgroud)

$scope.daysAvailable是从服务器加载$http请求

 $scope.init = function () {
    return $http.get('/OrderEntry/GetAvailableDays', { params: { method: shipMethod, state: state, zip: zip } }).then(function (data) {
        $scope.daysAvailable  data.data;
    });
}
Run Code Online (Sandbox Code Playgroud)

问题是我的HTML正在加载(并disabledDates()在结果从服务器返回并加载到控制器之前调用init()

如何在返回数据之前阻止日历加载?

May*_*ayK 5

您可以在daysAvailable到达后显示日期选择器:

<div ng-show="daysAvailable">
    <uib-datepicker  ng-model="date" ng-change="change()"  date-disabled="disabledDates(date,mode)"></uib-datepicker>
</div>
Run Code Online (Sandbox Code Playgroud)