Question

我在我的应用程序中使用ui-bootstrap，我发现ui.bootstrap.datepicker实际上是不可重用的。由于每个日期选择器都必须使用控制器来控制选择器的外观，方法是更改isOpen属性。

所以我想通过添加必需的属性和控制器来增强input类型date，我发现这个post很有用，这就是我现在所做的：< / p>

  function InputDirective($compile) {
    var addon =
      '<span class="input-group-btn">' +
      '<button type="button" class="btn btn-default" ng-click="inputCtrl.open()"><i class="glyphicon glyphicon-calendar"></i></button>' +
      '</span>';
    return {
      priority: 1000,
      restrict: 'E',
      controllerAs: 'inputCtrl',
      controller: function($scope) {
        var vm = this;
        this.open = function() {
          console.info("open");
          vm.isopen = true;
        }
      },
      compile: function(tElement, tAttrs) {
        if (tAttrs.type != "date")
          return;
        console.info(tElement);
        tElement.attr("datepicker-popup");
        tElement.attr("is-open", "inputCtrl.isopen");
        return {
          pre: function preLink(scope, iElement, iAttrs, controller) {},
          post: function postLink(scope, iElement, iAttrs, controller) {
            iElement.after($compile(addon)(scope));
            $compile(iElement)(scope);
          }
        }
      }
    };
  }

但是我发现compile函数将被称为无穷大，直到浏览器崩溃。

实例（注意标签可能会崩溃）：

http://plnkr.co/edit/m4i4Gs4zPff0q7ykpLcG

是否有可能解决这个问题？

在另一个指令中添加指令时进行无限编译

0 个答案: