Comments (4)
Same issue for me, time picker is not working on edge but works fine in chrome
from ngx-material-timepicker.
This can be worked around (read: hacked) by not using the [ngxTimepicker]
directive on the input you're displaying, and instead manually getting and processing the time. A hidden input such as <input [ngxTimepicker]="timePicker" hidden>
is however necessary because without attaching the <ngx-material-timepicker ...>
to an <input>
component, 'PM' values were returning as 'AM'.
Example Implementation
your.component.html
<input [ngxTimepicker]="timePicker" hidden>
<input matInput [(ngModel)]="onlyTimeString" (click)="timePicker.open()" />
<ngx-material-timepicker #timePicker (timeSet)="timeSet($event)"
[defaultTime]="onlyTimeString"></ngx-material-timepicker>
your.component.ts
onlyTimeString: string;
timeSet(time: string): void {
this.onlyTimeString = time.replace(/\u202f/g, " ");
}
For whatever reason, Edge returns a time with the character U+202f
instead of a space between the time part and the AM/PM. U+202f
looks like a space when output to the console, which was fun to diagnose...
from ngx-material-timepicker.
This can be worked around (read: hacked) by not using the
[ngxTimepicker]
directive on the input you're displaying, and instead manually getting and processing the time. A hidden input such as<input [ngxTimepicker]="timePicker" hidden>
is however necessary because without attaching the<ngx-material-timepicker ...>
to an<input>
component, 'PM' values were returning as 'AM'.Example Implementation
your.component.html
<input [ngxTimepicker]="timePicker" hidden> <input matInput [(ngModel)]="onlyTimeString" (click)="timePicker.open()" /> <ngx-material-timepicker #timePicker (timeSet)="timeSet($event)" [defaultTime]="onlyTimeString"></ngx-material-timepicker>
your.component.ts
onlyTimeString: string; timeSet(time: string): void { this.onlyTimeString = time.replace(/\u202f/g, " "); }For whatever reason, Edge returns a time with the character
U+202f
instead of a space between the time part and the AM/PM.U+202f
looks like a space when output to the console, which was fun to diagnose...
it's working fine for me
from ngx-material-timepicker.
Can you check it with the new version? It should be fixed
from ngx-material-timepicker.
Related Issues (20)
- Angular v14 - setLocale() missing HOT 1
- Table stylesheet broken after displaying calendar
- Disable specific hoursValues
- Issue with 24 hr format HOT 6
- NgxMaterialTimepickerModule is not compatible with Angular Ivy HOT 7
- editable dial is not updating when user click on hour and minutes while enableKeyboardInput is true HOT 7
- Ngx-material-timepicker validation [min] not working for hours
- Remove console log from build file(version 13.0.3) HOT 1
- Is this compatiable with Angular 15 and above? HOT 1
- style not loaded initially, but when click on regular material date picker after that style works fine for ngx-datetime picker HOT 1
- How to reuse styles in Custom Template?
- empty or 00:00
- How to show HH:MM:XM instead of H:MM:XM
- Focus move to minutes when updating hours in the editable dial using the arrow keys HOT 1
- Upgrading Luxon to v3
- I can not get selected value using timeSet event. HOT 1
- Application failing to load with console errors related to NgxMaterialTimepickerService
- HH:MM not displaying while timepicker is shown inside mat-dialog-content
- When timepicker is disabled the icon should be disabled too.
- No event triggered when hours and mins field are made empty i.e HH and MM
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ngx-material-timepicker.