Question

尝试实现离子日期选择器，rajesh这是依赖注入之后的控制器实现

.controller('PostCtrl', function ($scope, partyStore, $rootScope, $ionicPopup, $location) {
    $scope.currentDate = new Date();
    $scope.title = "Custom Title";

    $scope.datePickerCallback = function (val) {
        if (typeof (val) === 'undefined') {
            console.log('Date not selected');
        } else {
            console.log('Selected date is : ', val);
        }
    };

这是渲染视图的模板，

<ionic-datepicker idate="currentDate" disablepreviousdates="true" disablefuturedates="false" callback="datePickerCallback"
        title="title">
            <button class="button button-block button-positive">{{ currentDate | date:'dd - MMMM - yyyy' }}</button>
        </ionic-datepicker>

这是它产生的错误

TypeError: a.callback is not a function
at link.n.on.e.show.buttons.onTap (ionic-datepicker.js:1)
at Scope.IonicModule.factory.extend.$buttonTapped (ionic.bundle.js:45347)
at $parseFunctionCall (ionic.bundle.js:21044)
at ionic.bundle.js:53458
at Scope.$get.Scope.$eval (ionic.bundle.js:23100)
at Scope.$get.Scope.$apply (ionic.bundle.js:23199)
at HTMLButtonElement.<anonymous> (ionic.bundle.js:53457)
at HTMLButtonElement.eventHandler (ionic.bundle.js:11713)
at triggerMouseEvent (ionic.bundle.js:2863)
at tapClick (ionic.bundle.js:2852)

Answer 1

你做得不好，你有没有按照步骤进行操作？

2）在index.html文件中提供ionic-datepicker.bundle.min.js的路径。

<!-- path to ionic/angularjs -->
<script src="lib/ionic-datepicker/dist/ionic-datepicker.bundle.min.js"></script>

3）在你的应用程序模块中注入依赖项ionic-datepicker，以便使用离子时间选择器

angular.module('mainModuleName', ['ionic', 'ionic-datepicker']){
//
}

4）在模板的相应控制器中使用以下格式

$scope.datepickerObject = {
  titleLabel: 'Title',  //Optional
  todayLabel: 'Today',  //Optional
  closeLabel: 'Close',  //Optional
  setLabel: 'Set',  //Optional
  setButtonType : 'button-assertive',  //Optional
  todayButtonType : 'button-assertive',  //Optional
  closeButtonType : 'button-assertive',  //Optional
  inputDate: new Date(),  //Optional
  mondayFirst: true,  //Optional
  templateType: 'popup', //Optional
  showTodayButton: 'true', //Optional
  modalHeaderColor: 'bar-positive', //Optional
  modalFooterColor: 'bar-positive', //Optional
  from: new Date(2012, 8, 2), //Optional
  to: new Date(2018, 8, 25),  //Optional
  callback: function (val) {  //Mandatory
    datePickerCallback(val);
  },
  dateFormat: 'dd-MM-yyyy', //Optional
  closeOnSelect: false, //Optional
};

var datePickerCallback = function (val) {
  if (typeof(val) === 'undefined') {
    console.log('No date selected');
  } else {
    console.log('Selected date is : ', val)
  }
};

5）然后在template / html文件中使用以下格式

<ionic-datepicker input-obj="datepickerObject">
  <button class="button button-block button-positive"> {{datepickerObject.inputDate | date:datepickerObject.dateFormat}}</button>
</ionic-datepicker>

Answer 2

尝试使用此

http://ngcordova.com/docs/plugins/datePicker/

（这里是从ngCordova开始：http://ngcordova.com/docs/install/）

真的很容易使用

AppConsumerDetailsService

离子datepicker凉亭组件错误

2 个答案: