How can I get the selected time from a TimePicker in a form?
Using a TimePicker in a form:
<label class="padd"> Time of visiting </label>
<ngb-timepicker [(ngModel)]="meridianTime" [meridian]="meridian"
formControlName="time" id="time" ></ngb-timepicker>
Here is the TypeScript section:
defaultTime = {hour: 13, minute: 30};
customTime: NgbTimeStruct = {hour: 13, minute: 30, second: 0};
hourStep = 1;
minuteStep = 15;
Plenty of time is available for you. Here are the documents you need: link
You are equipped with hour, minute, and second properties for time. These can be transformed to suit your requirements using either the built-in JavaScript API, such as Date, or external libraries like moment. Alternatively, you could take a look at this resource: :)
Hence, the date will be in timepicker format, represented as an object. You could create something similar to the following:
prepareDate(dateAsObject) {
return dateAsObject.hour + ':' + dateAsObject.minute + ':' + dateAsObjet.second;
}
This is just one approach off the top of my mind. Feel free to adjust the date according to your preferences.
For achieving the time in a 24-hour format, consider utilizing
dateAsObject.toLocaleTimeString()I came across the following code from the book Mastering Angular 2 Components, but it seems to be incompatible with Angular 2 RC. The **provide()** function is no longer a part of angular/core in the current version. I really need this code to work: cons ...
I am encountering a dilemma with my effects function, where I am attempting to pass data from a dispatched action and a separate selector to a service function. However, I am finding myself confused by the RXJS syntax and suspect that I may not be mapping ...
Hey everyone, I've been using ng2-Simple-timer for my Angular 5 application to keep track of time. I wasn't sure how to record time with Angular 5, so I opted for ng2-Simple-Timer instead. My goal is to record time in milliseconds, and I found a ...
Hey there! I've been trying to update a string linked to a specific class or tag using settimeout or another callback, but unfortunately, I haven't had any success. It seems to work perfectly fine when triggered by a button click, but for some re ...
const fetchData = async () => { try { const usersData = await users.find({}).toArray(); state.response.end(JSON.stringify({ message: usersData })); if (!!usersData) { const collageData = await ...
I have taken a word and split it into an array. Now, I am trying to divide that array into 3 separate objects like this: Input: var input = "7RD FLOOR, PAVE AVENUE BUILDING, DUNG STREET, 48 JUNG-GU, SEOUL 100-203" Desired Output: let addresses = { ad ...
I've developed two Angular libraries - one that depends on the other. The dependent library requires configuration through the forRoot method. How can I effectively pass the configuration data from the parent library to its dependency? For instance, ...
After successfully creating an app using Ionic 2 Beta 7, I uploaded it to Github and cloned it into a different directory. Once in the new directory, I performed npm install and ionic state restore to install dependencies and added the android platform. ...
Having recently created a new Angular app and converted it to Angular Universal, I encountered an issue when running the project using npm run dev:ssr. The error displayed in the terminal is as follows: ERROR Error: Uncaught (in promise): Error: NG04002 Er ...
Currently, I am utilizing ngrx and here is my initialState setup: export interface Bonus110State { agent: Agent; isEdited: boolean; isResetted: boolean; steps: Step[]; response: ResponseReport; customer: any | null; address: Address | null; ...
Utilizing custom properties permits seamless data binding between multiple components. <section id="main"> <app-home [dict]="dict">Hello there!</app-home> </section> In this scenario, dict serves ...
Preferably seeking a JavaScript solution, with Angular2 as the top choice I am currently attempting to generate my navigation bar dynamically based on an API call. The main issue I'm facing is ensuring that the parent li has an active class when ano ...
It seems like Angular is expecting me to use single quotes for the class names even if there are no hyphens in my CSS class name. I've tried everything but Angular keeps insisting on using hyphens for this specific CSS class... it's strange, or m ...
When dealing with an array of union, checking the typeof value can be done this way: //case 1 function something1(a1: Array<number | string | boolean>) { for (const v of a1) if (typeof v === "number") v; //v is number ...
Currently, I am trying to download a file in pdf format using Angular 2. For this purpose, I have incorporated FileSaver.js to facilitate the saving of the file as a pdf. (response) => { var mediaType = 'application/pdf'; let pdfConte ...
The home page and user page contents are both displayed on the home page itself. In the header section, I have a SignIn and SignUp form from the home.html file. Additionally, there is another Signup form from the user page. This form includes 3 buttons: on ...
Imagine having a text file with the following content: AAAA k1="123" k2="456" several lines of other stuff AAAA k1="789" k2="101" AAAA k1="121" k2="141" The objective is to extract the values of k1 and k2 while keeping them grouped together. For instance ...
I require assistance with implementing an auto-complete field using Angular Materials. Upon page load, a service is utilized to make an API call to a backend node application that communicates with a sandbox API to retrieve a list of supported cities. This ...
I have implemented a global exception handler as shown below to catch exceptions successfully. However, the issue I am facing is that I am using Spring as my Angular backend and I do not wish to return a ModelAndView Object. My main concerns are: I want ...
After creating a server with Spring Boot that listens to @GetMapping("/portGroup/{portGroup}/date/{date}") I encountered a 400 "Bad Request" error when trying to query this endpoint. Can anyone guide me on the correct method to send a GET request to thi ...