ionic-team / ionic-team/ionic-framework

bug: Unable to choose preselected time through ion-datetime-button using minuteValue

Open
#30,184 1 comment 0 reactions 0 assignees View on GitHub
triage
Dominant language
TypeScript
Stars
52.7k
Forks
13.3k
Avg merge
1d 15h
Merged PRs (30d)
51

Description

### Prerequisites

- [x] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
- [x] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [x] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v8.x

### Current Behavior

When using `minuteValue` for `ion-datetime` and the current time does not match a valid time according to the `minuteValue`, the preselected time when opening the `ion-datetime` modal, does not emit a value. And the `ion-datetime-button` keeps showing the current (invalid) time.

Only by changing the time to something else, and then changing it back, will it emit the chosen value.

![Image](https://github.com/user-attachments/assets/5864037e-7031-452b-acc8-09fbe0fb3669)

### Expected Behavior

I should be able to select the time the time picker has preselected.

### Steps to Reproduce

1. Use this template code

```html



```

2. Make sure the current time is not a valid value
3. Open the time picker
4. Click "done"
5. No value was selected or emitted, the time picker still shows the original time.

### Code Reproduction URL

https://stackblitz.com/edit/sgkfctaz-ahbwunyn?file=src%2Fapp%2Fexample.component.html

### Ionic Info

```
Ionic:

Ionic CLI : 7.2.0 (C:\Users\\AppData\Local\nvs\node\22.12.0\x64\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 8.4.2 (C:\Users\\Projects\\node_modules\@ionic\angular)
@angular-devkit/build-angular : 19.1.4 (C:\Users\\Projects\\node_modules\@angular-devkit\build-angular)
@angular-devkit/schematics : 19.1.4 (C:\Users\\Projects\\node_modules\@angular-devkit\schematics)
@angular/cli : 19.1.4 (C:\Users\\Projects\\node_modules\@angular\cli)
@ionic/angular-toolkit : 12.1.1 (C:\Users\\Projects\\node_modules\@ionic\angular-toolkit)

Capacitor:

Capacitor CLI : not installed
@capacitor/android : 6.2.0 (C:\Users\\Projects\\node_modules\@capacitor\android)
@capacitor/core : 6.2.0 (C:\Users\\Projects\\node_modules\@capacitor\core)
@capacitor/ios : 6.2.0 (C:\Users\\Projects\\node_modules\@capacitor\ios)

Utility:

cordova-res : not installed globally
native-run : not installed globally

System:

NodeJS : v22.12.0 (C:\Users\\AppData\Local\nvs\default\node.exe)
npm : 11.1.0
OS : Windows 10
```

### Additional Information

Related to https://github.com/ionic-team/ionic-framework/issues/30183

Contributor guide

Open the contributing guide

Research direction

Start with the linked StackBlitz reproduction and the ion-datetime and ion-datetime-button components, using minuteValues="0" with an invalid current minute. Confirm the modal's Done action emits no value, then verify the fix by selecting the preselected valid time and checking that the button updates and the value is emitted.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.