Question

我创建了一个bootstrap datepicker：

app.directive('datePicker', function() {
  return {
    templateUrl: 'datepicker.html',
    controller: function($scope){
      console.log('it works');
      $scope.today = function() {
        $scope.dt = new Date();
      };
      $scope.today();

      $scope.showWeeks = true;
      $scope.toggleWeeks = function () {
        $scope.showWeeks = ! $scope.showWeeks;
      };

      $scope.clear = function () {
        $scope.dt = null;
      };

      // Disable weekend selection
      $scope.disabled = function(date, mode) {
        return ( mode === 'day' && ( date.getDay() === 0 || date.getDay() === 6 ) );
      };

      $scope.toggleMin = function() {
        $scope.minDate = ( $scope.minDate ) ? null : new Date();
      };
      $scope.toggleMin();

      $scope.open = function($event) {
        $event.preventDefault();
        $event.stopPropagation();

        $scope.opened = true;
      };

      $scope.dateOptions = {
        'year-format': "'yy'",
        'starting-day': 1
      };

      $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'shortDate'];
      $scope.format = $scope.formats[0];

      console.log('end of controller');
    }
  };
});

当我在我的页面上放置其中两条指令时，我只看到其中一条？这是为什么？如何获得2个独立的，所以我在第一个选择器中选择1个日期而在第二个选择器中选择另一个？

plunkr ref：http://plnkr.co/edit/QoiLt339m9x6pAswY0Kc?p=preview

Answer 1

因为你错过了指令体内的restrict:'E'财产为了使它们独立添加scope:{}属性，它使范围隔离。

http://plnkr.co/edit/aXW0zFR4t9kj75HxZ3kd?p=preview

为什么只有1个日期选择器可见？

1 个答案: