javascript - 将绑定(bind)模型)数据发送到 Angularjs 自定义指令

Question

/*我想要的是 将 maxDate 设置为 vmEndDate*/

   app.directive('myDatepicker', function ($parse) {
        return function (scope, element, attrs, controller) {

            var ngModel = $parse(attrs.ngModel);
            alert(element.val());
            $(function(){
                element.datepicker({
                    showOn:"both",
                   // changeYear:true,
                    //changeMonth:true,
                    dateFormat:'dd-MMMM-yyyy',
                    //maxDate: vmEndDate,
                    minDate: new Date(),
                   // yearRange: '1920:2012',
                    onSelect:function (dateText, inst) {
                        scope.$apply(function(scope){
                            // Change binded variable
                            ngModel.assign(scope, dateText);
                        });
                    }
                });
            });
        }
    });

/*html代码*/

 <input id="dp" type="text" ng-model="vmEndDate" name="mDate" my-datepicker/>

/目标:我想使用 Angular 自定义指令创建一个日期选择器(最大值和最小值)，最小值是当天日期，最大日期是虚拟机结束日期(从服务器接收)/

Answer 1

这是工作示例，

app.directive('myDatepicker', function ($parse) {

    return function (scope, element, attrs, controller) {
        var ngModel = $parse(attrs.ngModel);
        var vmEndDate = scope.$eval(attrs.ngModel);
        $(function () {
            element.datepicker({
                showOn: "both",
                // changeYear:true,
                //changeMonth:true,
                dateFormat: 'd-M-yy',
                maxDate: new Date(vmEndDate),
                minDate: new Date() ,
                // yearRange: '1920:2012',
                onSelect: function (dateText, inst) {
                    scope.$apply(function (scope) {
                        // Change binded variable
                        ngModel.assign(scope, dateText);
                    });
                }
            });
        });
    }
});


    <input id="dp" type="text" ng-model="vmEndDate" ng-init="vmEndDate ='27-Feb-2015'" name="mDate" my-datepicker />