knockout js datepickerにデフォルトの日付を追加します。

Question

knockout js datepickerを使用しています。今日の日付をデフォルトの日付に設定し、今年の1月1日を2番目の日付に設定する必要があります。これは現在の日付とまったく同じです。ここ

は私のjs一部

ko.bindingHandlers.datepickerCtrl = { 
init: function (element, setup, allBindingsAccessor, viewModel, bindingContext) { 
    var widget = $(element); 
    var vl = setup(); 
    var valueName = vl.valueName; 
    var id = vl.id == null ? valueName : vl.id; 
    var enableExpr = vl.enableExpr; 
    var innerHtml = '<div id="' + id + '" class="input-group date" data-provide="datepicker" style="max-width:110px!important" ' + 
       'data-bind="' + (enableExpr != null ? 'enable: ' + enableExpr + ',' : '') + 'validationOptions: { insertMessages: false}">' + 
        '<input type="text" class="form-control" data-bind="' + (enableExpr != null ? 'enable: ' + enableExpr + ',' : '') + 'value: ' + valueName + '">' + 
        '<span class="input-group-addon" style="padding-bottom: 1px!important;padding-top: 1px!important;padding-right: 3px!important;padding-left: 3px!important;"><i class="glyphicon glyphicon-calendar"></i></span></div>' + 
        '<p class="validationMessage" data-bind="validationMessage: ' + valueName + '"></p>'; 
    widget.html(innerHtml); 
    ko.utils.registerEventHandler(widget.find("span"), "click", function (event) { 
     widget.find("input").focus(); 
    }); 
}, 

}です。ここ

は、HTMLの一部です：

<div class="col-md-8" data-bind="datepickerCtrl: {valueName:'dtS'}"></div> 

Answer 1

このLink

ko.bindingHandlers.datepicker = { 
 
    init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { 
 
     //initialize datepicker with some optional options 
 
     var options = { 
 
      format: 'DD/MM/YYYY HH:mm', 
 
      defaultDate: valueAccessor()() 
 
     }; 
 

 
     if (allBindingsAccessor() !== undefined) { 
 
      if (allBindingsAccessor().datepickerOptions !== undefined) { 
 
       options.format = allBindingsAccessor().datepickerOptions.format !== undefined ? allBindingsAccessor().datepickerOptions.format : options.format; 
 
      } 
 
     } 
 

 
     $(element).datetimepicker(options); 
 

 
     //when a user changes the date, update the view model 
 
     ko.utils.registerEventHandler(element, "dp.change", function (event) { 
 
      var value = valueAccessor(); 
 
      if (ko.isObservable(value)) { 
 
       value(event.date); 
 
      } 
 
     }); 
 

 
     var defaultVal = $(element).val(); 
 
     var value = valueAccessor(); 
 
     value(moment(defaultVal, options.format)); 
 
    }, 
 
    update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { 
 
     var thisFormat = 'DD/MM/YYYY HH:mm'; 
 

 
     if (allBindingsAccessor() !== undefined) { 
 
      if (allBindingsAccessor().datepickerOptions !== undefined) { 
 
       thisFormat = allBindingsAccessor().datepickerOptions.format !== undefined ? allBindingsAccessor().datepickerOptions.format : thisFormat; 
 
      } 
 
     } 
 

 
     var value = valueAccessor(); 
 
     var unwrapped = ko.utils.unwrapObservable(value()); 
 

 
     if (unwrapped === undefined || unwrapped === null) { 
 
      element.value = new moment(new Date()); 
 
      console.log("undefined"); 
 
     } else { 
 
      element.value = unwrapped.format(thisFormat); 
 
     } 
 
    } 
 
}; 
 

 

 
var viewModel = {}; 
 

 
function QuoteViewModel(data) { 
 
    var self = this; 
 
    self.QuoteDateTime = ko.observable(data.QuoteDateTime); 
 

 
    self.print = function() { 
 
     console.log(self.QuoteDateTime()) 
 
    } 
 

 
}; 
 

 
var defaultModel = { 
 
    QuoteDateTime: "/Date(1427368178400)/" 
 
} 
 

 
viewModel = new QuoteViewModel(defaultModel); 
 
ko.applyBindings(viewModel);