Question

我一直关注this post以增加或更改UI Bootstrap。它非常有用，但我最近在增加datepicker时遇到了障碍。我有以下（修剪过的）装饰器：

DatepickerDecorator.$inject = ['$delegate', '$compile', 'shWrapper'];
function DatepickerDecorator($delegate, $compile, shWrapper) {
    var directive = $delegate[0],
        controller = directive.controller;

    directive.controller = myDatepickerController;

    myDatepickerController.$inject = ['$scope', '$element', '$attrs', '$controller'];
    function myDatepickerController($scope, $element, $attrs, $controller) {
        angular.extend(this, $controller(controller, {
            $scope: $scope,
            $element: $element,
            $attrs: $attrs
        }));
    }

    return $delegate;
}

出于某种原因，这会破坏日期选择器。用户无法再以day模式在月份之间导航。

为什么这会破坏功能，我该如何解决？

<小时/> 这是一个复制问题的片段：

var module = angular.module('decorate.datepicker', ['ui.bootstrap']);
module.config(ConfigureDatepicker);

ConfigureDatepicker.$inject = ['$provide'];
function ConfigureDatepicker($provide) {
  // Augment Angular Bootstrap's datepicker (popup)
  $provide.decorator('uibDatepickerDirective', DatepickerDecorator);
}

DatepickerDecorator.$inject = ['$delegate'];
function DatepickerDecorator($delegate) {
  var directive = $delegate[0],
    controller = directive.controller;

  // You can comment out this line and it will work.
  directive.controller = myDatepickerController;

  myDatepickerController.$inject = ['$scope', '$element', '$attrs', '$controller'];
  function myDatepickerController($scope, $element, $attrs, $controller) {
    angular.extend(this, $controller(controller, {
      $scope: $scope,
      $element: $element,
      $attrs: $attrs
    }));
  }

  return $delegate;
}

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap-tpls.js"></script>
</head>
<body>
  <div ng-app="decorate.datepicker">
    <p>Once the input or datepicker has focus, ESC closes the datepicker and the down arrow opens it.</p>
    <input ng-model="dt" uib-datepicker-popup />
  </div>
</body>

它抛出的例外是：

TypeError：无法读取未定义的属性'years'
在r。$ scope.move（https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap-tpls.js:2206:70）
在fn（eval at（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:213:110），：4：227）
在e（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:254:74）
在r。$ eval（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:133:313）
在r。$ apply（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:134:17）
在HTMLButtonElement。（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:254:126）
在if（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:35:367）
在HTMLButtonElement.Hf.d（https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js:35:314）

在day模式下，步骤变量在https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.1/ui-bootstrap-tpls.js的第2160行定义。

装饰AngularJS指令

0 个答案: