Question

下面的Add New Event按钮使我的模态显示（使用event.js），但我也希望我的datetimepicker通过初始化（在datetimepicker.js中）。

在event.js中执行代码后立即调用datetimepicker.js的语法是什么？

的index.html

<body ng-cloak="" ng-app="eventdemo">
    <div id="eventdemo" ng-controller="MainCtrl as vm" class="row">
        <button class="btn btn-primary pull-right" ng-click="vm.eventCreateClicked(vm.events)">Add new event</button>
    </div>          


    <!-- ################# Modal - Create new event ################# -->
    <div ng-app="app" ng-controller="DatepickerDemoCtrl">
      <script type="text/ng-template" id="modalCreateEventContent.html">
        <div class="modal-body" id="modalEventCreate">

          <div class="modal-header">
            <h3 class="modal-title">Add a new event</h3>
          </div>

            <div class="row">
              <div class="col-md-6">
                <label for="appointment_start">Appointment start:</label>
                <p class="input-group">
                  <input type="text" id="appointment_start" name="appointment_start" class="form-control" readonly datepicker-popup="@{{format}}" ng-model="dt1" is-open="opened1" max-date="'2020-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)"  ng-required="true" close-text="Close" />
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" ng-click="open($event,'opened1')"><i class="glyphicon glyphicon-calendar"></i></button>
                    </span>
                </p>
                <br />
                <timepicker ng-model="dt1" hour-step="1" minute-step="15" show-meridian="true"></timepicker>
              </div>

          <div class="modal-footer">
            <button class="btn btn-primary" ng-click="vm.eventSaved(vm.event)">Save</button>
            <button type="button" class="btn btn-default" ng-click="$close()">Close</button>
          </div>
        </div>
      </script>
    </div>        <!-- ng-controller -->

event.js

'use strict';

angular
  .module('eventdemo', ['mwl.calendar', 'ui.bootstrap', 'ngTouch', 'ngAnimate'])
  .controller('MainCtrl', function ($modal, moment, $http) {

    var vm = this;

    vm.calendarView = 'month';
    vm.calendarDay = new Date();

// ****  Show Create Event Modal

    vm.eventCreateClicked = function(event) {
         showCreateEventModal(vm.events);
    };

    function showCreateEventModal(events) {

      var modalInstance;

        modalInstance = $modal.open({
        templateUrl: 'modalCreateEventContent.html',
        controller: function() {
          var vm = this;

          vm.eventSaved = function() { 

               $http.put('/api/events/').success(function(eventsuccess){
               }).error(function(err){
               /* do something with errors */
               });

               modalInstance.close();
          };
        },
        controllerAs: 'vm'
      });
    }
  });

datetimepicker.js

angular
  .module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap'])
  .controller('DatepickerDemoCtrl', function ($scope) {

  $scope.today = function() {

    var dt1 = new Date();
    dt1.setHours( 9 );
    dt1.setDate( dt1.getDate() + 1 );
    dt1.setMinutes( 0 );
    $scope.dt1 = dt1;

    var dt2 = new Date();
    dt2.setHours( 10 );
    dt2.setDate( dt2.getDate() + 1 )
    dt2.setMinutes( 0 );
    $scope.dt2 = dt2;
  };
  $scope.today();

  ** more code here **

从ng-click调用控制器的语法 - AngularJS

0 个答案: