Ui-tabset和bootstrap-daterangepicker不能一起工作？

我有一個應用程序，我使用ui-bootstrap-tabs。文檔here。與ng-bs-daterangepicker。我正在觀察的行爲是，只要我將daterangepicker放入UI UI中。它無法捕捉到附加的事件。但是，當我將輸入標籤移動到UI標籤之外時，它能夠捕獲與其關聯的事件。Ui-tabset和bootstrap-daterangepicker不能一起工作？

我創建了一個工作plunker來強調我的問題。

<body ng-app="myApp"> 
    <div ng-controller="testController"> 
     <uib-tabset> 
     <uib-tab index="0" heading="Drivers"></uib-tab> 
     <uib-tab index="1" heading="Charts"> 
      <input class="btn btn-danger" type="daterange" id="daterange1" ng-model="dates" format="DD MMM" ranges="ranges" /> 
     </uib-tab> 
     </uib-tabset> 
     <!-- <input class="btn btn-danger" type="daterange" id="daterange1" ng-model="dates" format="DD MMM" ranges="ranges" /> --> 
    </div> 
    </body>

這裏有兩個輸入標籤。一個在uib-tab內部和其他外部。

$scope.dates = { 
    startDate: moment().startOf('day'), 
    endDate: moment().endOf('day') 
    }; 

    $scope.ranges = { 
    'Today': [moment(), moment()], 
    'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)], 
    'Last 7 days': [moment().subtract('days', 7), moment()], 
    'Last 30 days': [moment().subtract('days', 30), moment()], 
    'This month': [moment().startOf('month'), moment().endOf('month')] 
    }; 
    $('#daterange1').on('apply.daterangepicker', function(ev, picker) { 
    console.log(picker.startDate); 
    console.log(picker.endDate); 
    });

當我啓動裏面輸入按鈕，但是當我激活外面一個被稱爲事件apply.daterangepicker不叫。

我的做法
我猜測它不是一個範圍問題，因爲在一些職位突出。因爲如果是這樣的話，那麼即使是這樣的日期也是如此。另一件事可能是已知的問題列它說

要在標籤中使用可點擊元素，你必須重寫標籤模板使用div元素，而不是錨元素，並從引導的CSS複製所期望的風格。這是由於瀏覽器將定位元素解釋爲任何點擊事件的目標，當某些元素（例如按鈕在嵌套元素中嵌套）時觸發路由。

也許不知何故，這是停止事件傳播。我被困在這一點，不能想出如何解決它的解決方案。希望社區在這裏幫助...

來源

2016-11-25 Saras Arya

嗯......我現在面臨的正是這種問題試圖硬塞進一個陣營組件遺贈標籤集，謝謝 – ptim

在$('#daterange1').on的情況下，在調用.on()時，如果獲取附件的事件必須存在。

當daterangepicker在裏面Tabs組件初始化，你可以把事件是這樣的：

$("body").on("apply.daterangepicker", "#daterange1", function(e,picker) { 
    console.log(picker.startDate); 
    console.log(picker.endDate); 
});

Modified plunker

來源

2016-11-28 17:16:32

這樣做...非常感謝... –

那麼你是如何弄清楚的？你知道嗎，還是通過調試？ –

我懷疑它，因爲.on（）函數需要應用於一個靜態對象，否則事件將不會被註冊 –

Ui-tabset和bootstrap-daterangepicker不能一起工作？

回答

相關問題