2017-08-07 347 views
6

在我使用此npm的angularjs-DatePicker之前。如何在angularjs中獲取明智的開始日期和結束日期

在這裏,我可以選擇,這意味着周起始日期結束日期我不得不領域沒有fromdate之日起picker.But現在的日期和TODATE應顯示在任何日期挑那一週。

例如:在日曆中01-08-2017從Tue開始,因此每當選擇從01到05的任何日期時,這兩個字段應顯示爲FromDate爲01,TODate爲06,並且每當用戶選擇2017年3月31日,兩個字段應顯示爲7月30日和31日。

我有一個想法,以實現從FROM日期日曆的TODATE控制DOTNET的onchange事件爲類似下面的代碼

Convert.ToDouble(objstart.DayOfWeek)).ToString("dd-MM-yyyy") 

但如何實現這個用例在angularjs。

謝謝

+0

如果你必須在javascript中做很多日期操作,我推薦使用[moment.js](https://momentjs.com/) – devqon

+0

從你的例子來判斷:你想選擇所選日期的那一週適合英寸但是一週的開始和結束應該是在同一個月,總是在星期日開始。是對的嗎? – Salketer

+0

@Salketer是的。但不是強制性的星期日作爲默認即使星期一我們保持也沒有問題。 –

回答

2

好了,我會怎麼做是計算不同的日期,並根據一週的開始或結束取最小值/最大值。

這裏:

//Use the date received, UTC to prevent timezone making dates shift 
 
var pickedDate = new Date("08-03-2017UTC"); 
 
    
 
var startSunday = new Date(pickedDate); 
 
startSunday.setDate(pickedDate.getDate() - pickedDate.getDay()); 
 
var startMonth = new Date(pickedDate); 
 
startMonth.setDate(1); 
 
var startDate = Math.max(startMonth,startSunday); 
 

 
console.log("Start:" , new Date(startDate)); 
 

 
var endSaturday = new Date(pickedDate); 
 
endSaturday.setDate(pickedDate.getDate() + (7-pickedDate.getDay())); 
 
var endMonth = new Date(pickedDate); 
 
endMonth.setMonth(pickedDate.getMonth()+1);//Add a month 
 
endMonth.setDate(0);// to select last day of previous month. 
 
var endDate = Math.min(endMonth,endSaturday); 
 

 
console.log("End" , new Date(endDate));

訣竅是用日期玩,找出所有可能的開始和結束日期,然後選擇用Math.min和Math.max正確的它將使用它們的時間戳來比較日期。

+0

感謝您快速回答。讓我試試這個。 –

0

在JavaScript中有非常好的庫來處理日期操作。

https://github.com/datejs/Datejs

有一種方法

Date.parse('next friday')  // Returns the date of the next Friday. 
Date.parse('last monday') 

使用這些方法,你可以得到的開始和結束的基礎上,本週一周的日期。

我希望這會有所幫助。

+0

這有點可以接受,但是當每個星期的星期在tue結束時,那麼從你寫的這個函數中,它會顯示下個月的日期爲星期五的endDate。在這種情況下,它應該顯示開始日期爲太陽和結束日期爲tue本身 –

+0

如果可能,請嘗試在小提琴中顯示,以便我可以輕鬆地將我的場景與您聯繫,謝謝您的回答。 –

+0

嗨查蘭,可能是我無法清楚地理解這個問題。你到底需要什麼。也許你可以寫一些輸入和期望,以便我能理解。 – Ashvin777

-1

我想這裏沒有指令或過濾器,你需要爲自己創建一個。您可以參考日期對象date-time-object

0

您可以使用庫moment簡單地實現此目的。這個庫中有很多有用的功能。

var selectedDate = moment('Mon Aug 10 2017'); 

//If you want to get the ISO week format(Monday to Sunday) 
var weekStart = selectedDate.clone().startOf('isoweek').format('MMM Do'); 
var weekEnd = selectedDate.clone().endOf('isoweek').format('MMM Do'); 

//If you want to get the Sunday to Saturday week format 
var weekStart = selectedDate.clone().startOf('week').format('MMM Do'); 
var weekEnd = selectedDate.clone().endOf('week').format('MMM Do'); 
+0

這很好,但我的情況不是關於星期的格式。當用戶在DatePicker中選擇任何日期時,它應顯示該星期startdate和endDate –

+0

weekStart將具有值「8月7日」,並且weekEnd將具有「8月13日」。希望這是你想要的,對吧? –

0

這裏不需要角度指令,你可以使用下面的JavaScript擴展。

//get week from date 
Date.prototype.getWeekNumber = function (weekstart) { 


    var target = new Date(this.valueOf()); 

    // Set default for weekstart and clamp to useful range   
    if (weekstart === undefined) weekstart = 1; 
    weekstart %= 7; 

    // Replaced offset of (6) with (7 - weekstart) 
    var dayNr = (this.getDay() + 7 - weekstart) % 7; 
    target.setDate(target.getDate() - dayNr + 0);//0 means friday 

    var firstDay = target.valueOf(); 

    target.setMonth(0, 1); 
    if (target.getDay() !== 4) { 
     target.setMonth(0, 1 + ((4 - target.getDay()) + 7) % 7); 
    } 
    return 1 + Math.ceil((firstDay - target)/604800000);; 
}; 

//get date rance of week 
Date.prototype.getDateRangeOfWeek = function (weekNo, weekstart) { 

    var d1 = this; 
    var firstDayOfWeek = eval(d1.getDay() - weekstart); 
    d1.setDate(d1.getDate() - firstDayOfWeek); 

    var weekNoToday = d1.getWeekNumber(weekstart); 
    var weeksInTheFuture = eval(weekNo - weekNoToday); 

    var date1 = angular.copy(d1); 
    date1.setDate(date1.getDate() + eval(7 * weeksInTheFuture)); 
    if (d1.getFullYear() === date1.getFullYear()) { 
     d1.setDate(d1.getDate() + eval(7 * weeksInTheFuture)); 
    } 

    var rangeIsFrom = eval(d1.getMonth() + 1) + "/" + d1.getDate() + "/" + d1.getFullYear(); 

    d1.setDate(d1.getDate() + 6); 
    var rangeIsTo = eval(d1.getMonth() + 1) + "/" + d1.getDate() + "/" + d1.getFullYear(); 

    return { startDate: rangeIsFrom, endDate: rangeIsTo } 
}; 

你的代碼可以是這樣的

var startdate = '01-08-2017' 
       var weekList = []; 
       var year = startdate.getFullYear(); 
       var onejan = new Date(year, 0, 1);//first january is the first week of the year 
       var weekstart = onejan.getDay(); 
       weekNumber = startdate.getWeekNumber(weekstart); 

       //generate week number 
        var wkNumber = weekNumber; 
        var weekDateRange = onejan.getDateRangeOfWeek(wkNumber, weekstart); 
        var wk = { 
         value: wkNumber 
         , text: 'Week' + wkNumber.toString() 
         , weekStartDate: new Date(weekDateRange.startDate) 
         , weekEndDate: new Date(weekDateRange.endDate) 
        }; 
        weekList.push(wk); 
相關問題