UI引导日期选择器不调用内联控制器作用域上的函数

UI-Bootstrap datepicker does not call function on inline controller scope

本文关键字:控制器 作用域 函数 调用 日期 选择器 UI      更新时间:2023-09-26

我正试图在模态中的窗体中添加一个角度ui日期选择器,但它没有调用我试图在内联控制器的作用域上定义的函数,因此出现了问题。

我正在内联定义模态模板,以及使用开放调用内联定义模态的控制器。我尝试在调用addTimeline时传入外部控制器的作用域,但这似乎没有帮助。

这是我的代码:

$scope.addTimeline = function($scope, $modal) {
        $uibModal.open({
        templateUrl: 'modalContent1.html',
        controller: function($scope) {
          $scope.vm = {};
          $scope.vm.newEvent = {
            vak: '',
            soort: '',
            klas: '',
            groep: '',
            lokatie: '',
            begintijd: '',
            eindtijd: '',
            duratie: ''
          };
          $scope.opened = false;
          $scope.vm.toggle = function($event) {
            $event.preventDefault();
            $event.stopPropagation();
            $scope.opened = !$scope.opened;
          };
        },
        controllerAs: 'vm'
      });
    };
<button class="btn btn-primary " ng-click="addTimeline($scope, $modal)">
    Voeg tijdvak toe
</button>
<div class="form-group">
                    <label class="col-md-4 control-label" for="selectbasic">Begintijd</label>
                        <div class="col-md-4">
                            <p class="input-group">
                                <input type="text" class="form-control" readonly uib-datepicker-popup="dd MMMM yyyy" name="newEvent" ng-model="newEvent.begintijd" is-open="opened" close-text="Close">
                                <span class="input-group-btn">
                                  <button
                                  type="button"
                                  class="btn btn-default"
                                  ng-click="vm.toggle($event)">
                                  <i class="glyphicon glyphicon-calendar"></i>
                                </button>
                              </span>
                            </p>
                            <uib-timepicker ng-model="tijdvakStart" hour-step="1" minute-step="15" show-meridian="false">
                            </uib-timepicker>
                        </div>
                    </div>

您正在使用controllerAs:'vm'将您的控制器更改为controller:

function() {
  var vm = this;
  vm.newEvent = { vak: '', soort: '', klas: '', groep: '', lokatie: '', begintijd: '', eindtijd: '', duratie: '' };
  vm.opened = false;
  vm.toggle = function ($event) {
    $event.preventDefault();
    $event.stopPropagation();
    vm.opened = !vm.opened;
  };
}

或者简单地删除控制器A:'vm'