[英]daterangepicker not getting triggered
我正在頁面中實現daterange選擇器 。 但這是行不通的。 有人可以指出我做錯了什么或我想念的是什么。
CSHTML:
<div class="has-feedback" >
<input type="text" id="txtDateRange"
class="form-control input-md" name="RangeDates"
placeholder="Select Range"
ng-model="Model.RageDates">
<span class="form-control-feedback"><i class="glyphicon glyphicon-calendar fa fa-calendar"></i></span>
<span style="color: #a94442" >
<label class="control-label" class="has-error" ng-show="RangeDates.$invalid">Required.</label>
</span>
</div>
js:
DashBoardModule.controller('DashBoardController', ['$scope','$filter', 'DashBoardModuleService', function ($scope,$filter, DashBoardModuleService) {
$('#txtDateRange').on('apply.daterangepicker', function (ev, picker) {
$scope.isRefreshing = true;
$scope.Model.introductoryPeriodEnd = $filter('date')(new Date(picker.endDate), dateFormat);
$scope.Model.introductoryPeriodStart = $filter('date')(new Date(picker.startDate), dateFormat);
$scope.Model.typeAvailability = picker.chosenLabel === "Custom Range" ? "Custom" : picker.chosenLabel;
$scope.$apply();
});
angular.element(document).ready(function () {
var dateConfiguration = new Date();
$('#txtDateRange').daterangepicker({
ranges: {
'Next Week': [new Date(), dateConfiguration.setDate(dateConfiguration.getDate() + 6)],
'Next 2 Weeks': [new Date(), dateConfiguration.setDate(dateConfiguration.getDate() + 8)]
},
format: dateFormat,
autoApply: true
});
});
}]);
_Layout:
<!-- Range Date Picker -->
<link href="~/Scripts/Controls/DateRangePicker/daterangepicker.css" rel="stylesheet" />
<script src="~/Scripts/Controls/DateRangePicker/daterangepicker.js"></script>
首先,我沒有回答你的問題。 因為我希望為您提供建議:避免IT。
您在做什么不是Angular Way。 您正在以jQuery方式工作。 因此,使用Angular和Libs會更難。 因此,您有2個選擇:使用AngularJS或使用jQuery。
為什么不按角度進行操作:
0-使用Angular,您不應該使用jQuery選擇元素。 (您正在使用$('#txtDateRange').on('apply.daterangepicker',
和angular.element(document).ready
和$('#txtDateRange').daterangepicker
照顧這個 否則Angular會變得更難而不優雅。
如果您更喜歡使用angular,則可以使用ANGULAR日期選擇器,請檢查以下內容: http : //mgcrea.github.io/angular-strap/#/datepickers
希望對您有所幫助!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.