bug: Refresher Content's icon on IOS won't show up properly unless the refresh's processing

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/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

v7.x

### Current Behavior

The refreshing icon will not show up properly unless the refresh's already being processed.

https://github.com/ionic-team/ionic-framework/assets/93801443/a575878b-cb06-43db-a159-cf31a41f061a

### Expected Behavior

The icon should show up properly as soon as the user starts pulling up/down.

### Steps to Reproduce

Use an `ion-refresher-content`, and start pulling up/down on IOS mode.

### Code Reproduction URL

https://stackblitz.com/~/github.com/JasinRefiku/ionic-bug-reports

### Ionic Info

```
Ionic:

Ionic CLI : 7.1.5 REDACTED
Ionic Framework : @ionic/angular 7.7.1
@angular-devkit/build-angular : 17.1.3
@angular-devkit/schematics : 17.1.3
@angular/cli : 17.1.3
@ionic/angular-toolkit : 9.0.0

Capacitor:

Capacitor CLI : 5.7.0
@capacitor/android : 5.7.0
@capacitor/core : 5.7.0
@capacitor/ios : 5.7.0

Utility:

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

System:

NodeJS : v20.9.0 (C:\Program Files\nodejs\node.exe)
npm : 10.1.0
OS : Windows 10
```

### Additional Information

_No response_

Start with the ion-refresher-content reproduction at the linked StackBlitz project and reproduce the behavior in iOS mode while pulling up or down. Trace the refresher icon's display through the relevant Ionic component entry point; it is done when the icon appears correctly as soon as the gesture begins, before refresh processing starts.

由索引模型根据 Issue 内容生成。