Search code examples
angulardateionic-frameworkangular-materialionic4

Need Date functionality for Day Week Month Year in Ionic Angular


I Would like to show the current day, Week, Month, and Year in Angular If I click on Day need to show the current day so that I can click on greater than symbol to get the next day as well as the previous day when clicking on less than symbol like that I need to display week and month and year.enter image description here


Solution

  •       if (this.tabID === "Day") {
            const nextDay = new Date(myDate1);
            nextDay.setDate(myDate1.getDate() + 1);
            this.currentDate = nextDay;
            console.log("next ", nextDay);
          }
          if (this.tabID === "Month") {
            // for month
            const nextMonth = new Date(myDate1);
            nextMonth.setMonth(myDate1.getMonth() + 1);
            console.log("month ", nextMonth);
            this.currentDate = nextMonth;
          }
          if (this.tabID === "Week") {
            // for next week
            const firstDay = new Date(this.currentDate);
            const nextWeek = new Date(firstDay.getTime() + 7 * 24 * 60 * 60 * 1000);
            console.log("next week> ", nextWeek);
            this.currentDate = nextWeek;
            const current = new Date(this.currentDate); // get current date
            const weekstart = current.getDate(); // - 1 - current.getDay() + 1;
            const weekend = weekstart - 6; // end day is the first day + 6
            this.weekStart = new Date(current.setDate(weekstart)); // first day of week is Sunday
            this.weekEnd = new Date(current.setDate(weekend)); // last day of week is Saturday
            console.log("weekStart ", this.weekStart, "WeekEnd ", this.weekEnd);
          }
          if (this.tabID === "Year") {
            const nextMonth = new Date(myDate1);
            nextMonth.setFullYear(myDate1.getUTCFullYear() + 1);
            console.log("month ", nextMonth);
            this.currentDate = nextMonth;
          }
        }```
        by doing this I resolved the issue.
        this code is for only greater than icon in image