Convert custom string into Angular Date - javascript

I have a string like "August 24th, 2020" that I need to convert into the "Date" type in Angular. Is there any simple way to do this please?
I've tried this:
const deadline = new Date ("August 24th, 2020")
But that results in "Invalid Date".

Maybe moment.js is capable to parse that outside of the box, however, if you're not willing to attach external library and maintain its compatibility to the rest of your environment for this purpose only, you may parse that yourself:
const dateStr = "August 24th, 2020",
parseDate = s => {
const [, month, dd, yyyy] = s.match(/([a-z]+)\s(\d+)[a-z]+,\s(\d+)/i)||[],
months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
return new Date(Date.UTC(yyyy, months.indexOf(month), dd))
}
console.log(parseDate(dateStr))

Related

I cant use a part of data directly I have to use another variable in between

I am really new to programming and my questions are very really not good
Please forgive me if I am wasting your time
Why when I use labels indirectly in DatatoBarChartJS (using a "label") it works
const DataFromDataBase = {
label :['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets : [ {datasetName:'Dataset 1', data:[1,3,5,2,5,2,6]},{datasetName:'Dataset 2', data:[4,6,5,2,5,2,6]} ],
}
const label =dataFromDataBase.label;
const color = tinycolor();
const DatatoBarChartJS = {
label,
datasets : dataFromDataBase.datasets.map((dataset)=>{
return{
label:dataset.datasetName,
data : dataset.data,
backgroundColor:color.toRgbString ,
}
}
)
}
but when I use it inderectly it dosnt work?
const DataFromDataBase = {
label :['January', 'February', 'March', 'April', 'May', 'June', 'July'],
datasets : [ {datasetName:'Dataset 1', data:[1,3,5,2,5,2,6]},{datasetName:'Dataset 2', data:[4,6,5,2,5,2,6]} ],
}
const label =dataFromDataBase.label;
const color = tinycolor();
const DatatoBarChartJS = {
DataFromDataBase.label,
datasets : dataFromDataBase.datasets.map((dataset)=>{
return{
label:dataset.datasetName,
data : dataset.data,
backgroundColor:color.toRgbString ,
}
}
)
}
the problem is
problem
When creating an object using the curly bracket syntax, you usually need to provide the name of the fields and their associated value.
const cat = {
cute: true,
legCount: 4,
sound: 'miaw'
};
Depending on what "version of Javascript" you are using, there is a shorthand syntax that you can use:
const cute = true;
const legCount = 4;
const sound = 'miaw';
const cat = {
legCount,
sound,
cute
}
When doing this, the name of the field will be the name of the variable, and the value of the field will be the value of the variable.
The reason you cannot use that syntax in your case is because what you are referencing is not a variable, it's a field within an object. And it kind of makes sense, because the result would be ambiguous:
// Would the result be this?
{ DatatoBarChartJS: { label: ['January', 'February', 'March', 'April', 'May', 'June', 'July'] } }
// Or this?
{ 'DatatoBarChartJS.label': ['January', 'February', 'March', 'April', 'May', 'June', 'July'] }
// Or this?
{ label: ['January', 'February', 'March', 'April', 'May', 'June', 'July'] }
You can find more information in Mozilla's object initialization documentation

Get week day of current time in specified time zone

I need to get the week day of the current time in a specified timezone, and without using libraries. Numbered week days or strings are both fine.
I've used this approach to switch timezone:
new Date().toLocaleString("en-US", {timeZone: "America/Chicago"})
but the output is a string so I can't do date logic in it.
PS: I am on Google Apps Script, which is why I mentioned no libraries.
you can use special options for that:
{ weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
to show a week day:
new Date().toLocaleString('en-US', {day: '2-digit', timeZone: 'America/Chicago' })
or to show full day name:
new Date().toLocaleString('en-US', {weekday: 'long', timeZone: 'America/Chicago' })
I am suggesting you use the Intl.DateTimeFormat
const formatter = new Intl.DateTimeFormat('en-US', {
timeZone: "America/Chicago",
weekday: 'long',
})
console.log(formatter.formatToParts(new Date()))
// you get an array like : [{type: "weekday", value: "Friday"}]
You can use the Moment for this. It gives weekdays from local.
moment.months()
moment.monthsShort()
moment.weekdays()
moment.weekdaysShort()
moment.weekdaysMin()
It is sometimes useful to get the list of months or weekdays in a locale, for example when populating a dropdown menu.
moment.months();
Returns the list of months in the current locale.
[ 'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December' ]
Similarly, moment.monthsShort returns abbreviated month names, and moment.weekdays, moment.weekdaysShort, moment.weekdaysMin return lists of weekdays.
You can pass an integer into each of those functions to get a specific month or weekday.
moment.weekdays(3); // 'Wednesday'
As of 2.13.0 you can pass a bool as the first parameter of the weekday functions. If true, the weekdays will be returned in locale specific order. For instance, in the Arabic locale, Saturday is the first day of the week, thus:
moment.locale('ar');
moment.weekdays(true); // lists weekdays Saturday-Friday in Arabic
moment.weekdays(true, 2); //will result in Monday in Arabic

Control Month Year in Dropdown list

I am trying to control "Month" and "Year" in drop down list. I am having two fields, "Start Date" and "End Date". In that "Start Date" I am listing the "Current Month" and "Year" like "March 2020". I want to control my "End Date" based of "Start Date". For example if there is no "Month" selected in "Start Date" I should not allow user to select the "End Date". If user select's "MAY 2020" in "Start Date" and in "End Date" I want to display from "May 2020 to next May 2021". Like wise if user select's "June 2020" in "Start Date" and in "End Date" I want to display from "June 2020 to next June 2021". As of now I am displaying the current month and year in both Start and End date. Any one can guide me to achieve this. Thanks in Advance. Below is the code where I am getting current year month to next year.
const fareMon = () => {
const monthList = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
const currDate = new Date();
const year = currDate.getFullYear();
const months = [];
let currentMonthIndex = currDate.getMonth();
let yearsToAdd = 0;
for (let i = 0; i < 13; i += 1) {
if (currentMonthIndex === 12) {
currentMonthIndex = 0;
yearsToAdd += 1;
}
const futYear = year + yearsToAdd;
months.push(<option value={`${monthList[currentMonthIndex]} ${futYear}`}>{`${monthList[currentMonthIndex]} ${futYear}`}</option>);
currentMonthIndex += 1;
}
return <>{months}</>;
};
So, what I have done is, created a getFullYear function, where you can pass year and you will get all the months
Does this help:
const monthList = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
const getFullYear = (year) => {
const currentDate = new Date(`01 01 ${year}`);
const monthYear = [];
for(;currentDate.getFullYear() === year;){
const currentMonth = currentDate.getMonth();
monthYear.push(`${monthList[currentMonth]} ${year}`)
const nextMonth = currentMonth+1;
currentDate.setMonth(nextMonth);
}
return monthYear;
}
More cleaner and less compute intensive approach would be:
const monthList = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
const getYear = (year) => {
return monthList.map((month) => `${month} ${year}`);
}

JS includes from array to momentjs current date

I am wanting true or false return when using includes to see if the current month using moment().format('MMMM') is also in an array.
const splitMonths = ['April', 'May', 'June', 'July', 'August', 'September'];
const currentDate = moment().format('MMMM');
const seasonData = currentDate.includes(splitMonths);
console.log(seasonData);
The above returns false and I cannot understand why.
If I change splitMonths to splitMonths = ['May']; it will return true.
If I run console.log(currentDate) it returns May.
Why isn't this returning true?
You are checking array existence within the string currentDate.includes(splitMonths);. Instead it should be splitMonths.includes(currentDate);
const splitMonths = ['April', 'May', 'June', 'July', 'August', 'September'];
const month = "May";
const seasonData = splitMonths.includes(month);
console.log(seasonData);

ng-repeat parse array into string

Is it possible to parse in ng-repeat a array value into a string? I'll explain what I mean.
<tr ng-repeat="(key,property) in obj.properties">
<td>{{key}}</td>
<td>{{property}}</td>
</tr>
This {{property}} is an array e.g [ 7 , 8 ], but I would like to show "Jully - August". Is it possible through a filter? Or I need to parse it in the controller.
Use filter convert number to name of month:-
<td>{{property|monthName}}</td>
app.filter('monthName', [function() {
return function (monthNumber) {
//1 = January
var monthNames = [ 'January', 'February', 'March', 'April', 'May', 'June',
'July', 'August', 'September', 'October', 'November', 'December' ];
var nameList="";
for(var i=0;i<monthNumber.length;i++){
if(i==monthNumber.length-1){
nameList+=monthNames[monthNumber[i] - 1];
}else{
nameList+=monthNames[monthNumber[i] - 1]+"-";
}
}
return nameList;
}
}]);
Plunker
You can do it as well
<td>{{property|showMonthName}}</td>
app.filter('showMonthName', function() {
return function (months) {
var monthNames = [ 'January', 'February', 'March', 'April', 'May', 'June',
'July', 'August', 'September', 'October', 'November', 'December' ];
months = months.map(function(i){
return monthNames[i-1];
});
return months.join(' - ');
}
});
So I tried this in my own system. I created one filter and applied inside ng-repeat. It works perfectly. You can modify your own filter based on this one.
<test-directive keyword = "view.ctrlKeywordinput" ng-repeat="movie in [1,2]" ><div> {{movie | monthfilter}}</div></test-directive>
and here is my filter:
app.filter("monthfilter", function(){
return function(input){
switch(input){
case 1:
return "january";
break;
case 2:
return "february";
break;
}
};
});

Categories