Hey there,
I use ionic (@ionic/angular 4.11.10) in a bigger project and there is some strange Event-Thing going on on the “ion-range”.
I started a new blank projekt (ionic starter tabs) and there is the same thing going on. I am not sure if it is just normal now, or if it is some kind of a bug.
I like to use that ion-range in combination with an audio-player and the user should use it as a seekbar. So far so good.
No matter which event I use. I always get back a “CustomEvent”.
Template:
<ion-range (ionChange)="change($event)"></ion-range>
and ts-file:
change(value) {
console.log(value);
}
and log shows:
1. CustomEvent {isTrusted: false, detail: {…}, type: "ionChange", target: ion-range.md.hydrated.range-pressed, currentTarget: ion-range.md.hydrated.range-pressed, …}
1. isTrusted: false
2. detail: {value: 66}
3. type: "ionChange"
4. target: ion-range.md.hydrated
5. currentTarget: null
6. eventPhase: 0
7. bubbles: true
8. cancelable: true
9. defaultPrevented: false
10. composed: true
11. timeStamp: 9909.179999958724
12. srcElement: ion-range.md.hydrated
13. returnValue: true
14. cancelBubble: false
15. path: (21) [ion-range.md.hydrated, slot, main.inner-scroll.scroll-y, document-fragment, ion-content.md.hydrated, app-tab2.ion-page, slot, document-fragment, ion-router-outlet.hydrated, div.tabs-inner, ion-tabs, app-tabs.ion-page, slot, document-fragment, ion-router-outlet.hydrated, ion-app.md.ion-page.hydrated, app-root, body, html.plt-desktop.md.hydrated, document, Window]
16. __proto__: CustomEvent
So can anybody tell me if that is normal? In older versions there have been much more options, like “_isFocus” and stuff.
The thing is when I ise the ionBlur or ionFocus event i do not get the value the user clicked on because details is just empty with no value.
The old event looks like this one here:
1. Range {_config: Config, _elementRef: ElementRef, _renderer: RendererAdapter, _componentName: "range", _mode: "md", …}
1. min: (...)
2. max: (...)
3. step: (...)
4. snaps: (...)
5. pin: (...)
6. debounce: (...)
7. dualKnobs: (...)
8. ratio: (...)
9. ratioUpper: (...)
10. disabled: (...)
11. value: (...)
12. color: (...)
13. mode: (...)
14. _config: Config {_c: {…}, _s: {…}, _modes: {…}, _trns: {…}, plt: Platform}
15. _elementRef: ElementRef {nativeElement: ion-range.range.range-md.range-md-white.ng-valid.ng-dirty.ng-touched}
16. _renderer: RendererAdapter {delegate: DebugRenderer2}
17. _componentName: "range"
18. _mode: "md"
19. _defaultValue: 0
20. _form: Form {_focused: null, _ids: 35, _inputs: Array(1)}
21. _item: Item {_config: Config, _elementRef: ElementRef, _renderer: RendererAdapter, _componentName: "item", _mode: "md", …}
22. _ngControl: null
23. _isFocus: false
24. _disabled: false
25. _debouncer: TimeoutDebouncer {wait: 0, timer: null, callback: ƒ}
26. _init: true
27. _initModel: true
28. ionFocus: EventEmitter {_isScalar: false, observers: Array(0), closed: false, isStopped: false, hasError: false, …}
29. ionChange: EventEmitter {_isScalar: false, observers: Array(1), closed: false, isStopped: false, hasError: false, …}
30. ionBlur: EventEmitter {_isScalar: false, observers: Array(0), closed: false, isStopped: false, hasError: false, …}
31. _value: 26
32. id: "range-15-0"
33. _labelId: "lbl-15"
34. _haptic: Haptic {_p: undefined}
35. _plt: Platform {_versions: {…}, _qp: QueryParams, _bbActions: Array(1), _pW: 0, _pH: 0, …}
36. _dom: DomController {plt: Platform, r: Array(0), w: Array(0), q: false}
37. _cd: ViewRef_ {_view: {…}, _viewContainerRef: null, _appRef: null}
38. _min: 0
39. _max: 93
40. _step: 1
41. _valA: 26
42. _valB: 0
43. _ratioA: 0.27956989247311825
44. _ratioB: 0
45. _events: UIEventManager {plt: Platform, evts: Array(1)}
46. _slider: ElementRef {nativeElement: div.range-slider}
47. _color: "white"
48. _barL: ""
49. _barR: "72.04301075268818%"
50. _onChanged: ƒ (newValue)
51. _onTouched: ƒ ()
52. _rect: DOMRect {x: 95.234375, y: 391.234375, width: 243, height: 42, top: 391.234375, …}
53. _activeB: undefined
54. _pressed: false
55. _pressedA: false
56. _pressedB: false
57. __proto__: BaseInput
Is that a bug or now just normal? Thanks for the help so far. 