khashayar / ng-trim-value-accessor Goto Github PK
View Code? Open in Web Editor NEWAngular's (missing) trim accessor to automatically trim values of input fields
License: MIT License
Angular's (missing) trim accessor to automatically trim values of input fields
License: MIT License
Even if readonly is removed by angular data-binding, the accessor doesn't work.
When ngModel gets changed from a string
to null
/undefined
, view value remains unchanged.
Getting:
TypeError: Cannot read property 'setProperty' of undefined
when upgrading from Angular 4 to 5
using version 1.0.1
I created a new project just to make sure it wasn't me: https://github.com/BenAychh/ng-trim-value-accessor-tester
All of the sudden, angular gives me this error when I try to do anything with AOT (ng build --prod
or ng build --aot=true
):
ERROR in Directive TrimValueAccessor in /Users/benhernandez/ng-trim-value-accessor-tester/node_modules/ng-trim-value-accessor/src/trim-value-accessor.ts has no selector, please add it!
I would open a PR and fix it but I have no idea what is wrong with your selector. Everything looks correct to me?
Hello,
Using ng-trim with Angular Material appears to break the setting of the "touched" property of the input.
Here is an example:
https://stackblitz.com/edit/angular-68fg1b?file=index.html
The field has an error message defined that should show if the field has the "required" error and has been touched. However the touched property does not get updated when I click on the field (or when I enter data into it).
I'll gather more info as I debug ...
Thanks, :)
Hi,
When I import this module, components in my child modules are not getting the directive applied. So I import it to each of my module and then it works. I have not tested but I suspect if you add the forRoot method that can fix this issue.
Thanks
Hi,
Unless I am missing the point of this package, I would appreciate being able to automatically trim the value when the input receives blur event.
I tried adding something like:
@HostListener('blur', ['$event.target.value'])
applyTrim (val: string) {
this.writeValue(val.trim());
};
and it works for me.
The scenario this method handles:
When the field is supposed to be trimmed, we want it to be trimmed when the form is submitted but we also want the trimmed value to be applied in the UI.
Without it: the value only gets trimmed when the form is submitted, but it is not reflected in the UI when we leav the input
With it: the value is also applied to the UI on blur event.
It might of course be useful to provide an attribute parameter to explicitly enable the blur handler per input.
Applying this component in conjunction with another CustomValueAccessor
(like ng-bootstrap Datepicker to the same field would trigger the following error by Angular:
Error: More than one custom value accessor matches form control with unspecified name attribute
Here's more information on this:
angular/angular#16755
angular/angular#3009
I use ng-trim-value-accessor verion 3.0.2, it works correctly for string inputs but breaks number inputs whose values are transformed to a string by the accessor.
I can deactivate trim using class "ng-trim-ignore" on these inputs but it could be better to modify the selector to simply ignore it.
trim-value-accessor.ts:
constructor(private renderer: Renderer, private elRef: ElementRef, private compositionMode: boolean) {
super(renderer, elRef, compositionMode);
}
This directive works fine except of email inputs. They somehow are not updated.
FYI this was fixed like this in similiar plugin https://github.com/anein/angular2-trim-directive/blob/master/src/input-trim.directive.ts#L88
I've improved your selector to ignore radio buttons as well. Without it, radios miss values after init.
input:not([type=radio])[formControlName],
input:not([type=checkbox])[formControlName],
textarea[formControlName],
input:not([type=radio])[formControl],
input:not([type=checkbox])[formControl],
textarea[formControl],
input:not([type=radio])[ngModel],
input:not([type=checkbox])[ngModel],
textarea[ngModel],
[ngDefaultControl]
Hello,
ng-trim-value-accessor does not seem to work with Ivy as it raised the following error:
ERROR in There is no format with import statements in 'โฆ/node_modules/ng-trim-value-accessor' entry-point.
That seems related to: angular/angular#29564
Thanks
There is this conflicting scenario of using another library (i.e: ng-bootstrap Typeahead), which is applying its own custom value accessor to the input field, in this case angular throws the following error:
Error: More than one custom value accessor matches form control with unspecified name attribute
Although it has been addressed in #7 but the fix neither covers all the cases nor provides and opt-out solution. As a result the need of a general op-out option seems to be necessary.
We do the validation for the inputs, some are required. So we need to show error message if user click in and click out with nothing filled in. The input node has "ng-untouched" property, it should be changed to "ng-touched" after user click in, but it is not after using "ng-trim-value-accessor"
When i use this in my Existing project start to getting this error you can see complete error log below : -
core.js:1598 ERROR Error: Uncaught (in promise): Error: More than one custom value accessor matches form control with unspecified name attribute
Error: More than one custom value accessor matches form control with unspecified name attribute
at _throwError (forms.js:1799)
at forms.js:1857
at Array.forEach ()
at selectValueAccessor (forms.js:1846)
at new FormControlDirective (forms.js:4966)
at createClass (core.js:10158)
at createDirectiveInstance (core.js:10033)
at createViewNodes (core.js:11255)
at callViewAction (core.js:11571)
at execComponentViewsAction (core.js:11490)
at _throwError (forms.js:1799)
at forms.js:1857
at Array.forEach ()
at selectValueAccessor (forms.js:1846)
at new FormControlDirective (forms.js:4966)
at createClass (core.js:10158)
at createDirectiveInstance (core.js:10033)
at createViewNodes (core.js:11255)
at callViewAction (core.js:11571)
at execComponentViewsAction (core.js:11490)
at resolvePromise (zone.js:814)
at resolvePromise (zone.js:771)
at zone.js:873
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:4053)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
at drainMicroTaskQueue (zone.js:595)
at push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask (zone.js:500)
at ZoneTask.invoke (zone.js:485)
defaultErrorLogger @ core.js:1598
push../node_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:1647
next @ core.js:4727
schedulerFn @ core.js:3712
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub @ Subscriber.js:253
push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next @ Subscriber.js:191
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next @ Subscriber.js:129
push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next @ Subscriber.js:93
push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next @ Subject.js:53
push../node_modules/@angular/core/fesm5/core.js.EventEmitter.emit @ core.js:3704
(anonymous) @ core.js:4084
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
push../node_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:4021
onHandleError @ core.js:4084
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.handleError @ zone.js:392
push../node_modules/zone.js/dist/zone.js.Zone.runGuarded @ zone.js:154
_loop_1 @ zone.js:677
api.microtaskDrainDone @ zone.js:686
drainMicroTaskQueue @ zone.js:602
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
ZoneTask.invoke @ zone.js:485
timer @ zone.js:2054
setTimeout (async)
scheduleTask @ zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:2090
proto.(anonymous function) @ zone.js:1394
push../node_modules/@firebase/firestore/dist/index.cjs.js.AsyncObserver.scheduleEvent @ index.cjs.js:15347
push../node_modules/@firebase/firestore/dist/index.cjs.js.AsyncObserver.next @ index.cjs.js:15336
push../node_modules/@firebase/firestore/dist/index.cjs.js.QueryListener.raiseInitialEvent @ index.cjs.js:7767
push../node_modules/@firebase/firestore/dist/index.cjs.js.QueryListener.onViewSnapshot @ index.cjs.js:7707
push../node_modules/@firebase/firestore/dist/index.cjs.js.EventManager.listen @ index.cjs.js:7603
(anonymous) @ index.cjs.js:15244
(anonymous) @ index.cjs.js:13238
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
ZoneTask.invoke @ zone.js:485
timer @ zone.js:2054
setTimeout (async)
scheduleTask @ zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:2090
proto.(anonymous function) @ zone.js:1394
push../node_modules/@firebase/firestore/dist/index.cjs.js.AsyncObserver.scheduleEvent @ index.cjs.js:15347
push../node_modules/@firebase/firestore/dist/index.cjs.js.AsyncObserver.next @ index.cjs.js:15336
push../node_modules/@firebase/firestore/dist/index.cjs.js.QueryListener.raiseInitialEvent @ index.cjs.js:7767
push../node_modules/@firebase/firestore/dist/index.cjs.js.QueryListener.onViewSnapshot @ index.cjs.js:7707
push../node_modules/@firebase/firestore/dist/index.cjs.js.EventManager.onChange @ index.cjs.js:7644
(anonymous) @ index.cjs.js:9053
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2969
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:3001
proto.(anonymous function) @ zone.js:1394
push../node_modules/@firebase/webchannel-wrapper/dist/index.js.g.fa @ index.js:65
Xc @ index.js:35
Yc @ index.js:34
push../node_modules/@firebase/webchannel-wrapper/dist/index.js.g.Pa @ index.js:81
Vb @ index.js:29
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2969
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:3001
proto.(anonymous function) @ zone.js:1394
push../node_modules/@firebase/webchannel-wrapper/dist/index.js.g.fa @ index.js:65
Xc @ index.js:35
Vc @ index.js:34
push../node_modules/@firebase/webchannel-wrapper/dist/index.js.g.Qa @ index.js:77
(anonymous) @ index.js:33
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:496
ZoneTask.invoke @ zone.js:485
timer @ zone.js:2054
setTimeout (async)
scheduleTask @ zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:2090
proto.(anonymous function) @ zone.js:1394
Ec @ index.js:33
Fe @ index.js:74
Td @ index.js:82
Sd @ index.js:55
push../node_modules/@firebase/webchannel-wrapper/dist/index.js.g.fb @ index.js:96
sendFn @ index.cjs.js:7012
push../node_modules/@firebase/firestore/dist/index.cjs.js.StreamBridge.send @ index.cjs.js:6813
push../node_modules/@firebase/firestore/dist/index.cjs.js.PersistentStream.sendRequest @ index.cjs.js:13666
push../node_modules/@firebase/firestore/dist/index.cjs.js.PersistentListenStream.watch @ index.cjs.js:13886
push../node_modules/@firebase/firestore/dist/index.cjs.js.RemoteStore.sendWatchRequest @ index.cjs.js:14578
(anonymous) @ index.cjs.js:14617
forEachNumber @ index.cjs.js:433
(anonymous) @ index.cjs.js:14616
step @ tslib.es6.js:91
(anonymous) @ tslib.es6.js:72
(anonymous) @ tslib.es6.js:65
ZoneAwarePromise @ zone.js:891
__awaiter @ tslib.es6.js:61
push../node_modules/@firebase/firestore/dist/index.cjs.js.RemoteStore.onWatchStreamOpen @ index.cjs.js:14613
(anonymous) @ index.cjs.js:13787
(anonymous) @ index.cjs.js:13837
(anonymous) @ index.cjs.js:13238
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
ZoneTask.invoke @ zone.js:485
timer @ zone.js:2054
setTimeout (async)
scheduleTask @ zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:2090
proto.(anonymous function) @ zone.js:1394
push../node_modules/@firebase/firestore/dist/index.cjs.js.WebChannelConnection.openStream @ index.cjs.js:7097
push../node_modules/@firebase/firestore/dist/index.cjs.js.PersistentListenStream.startRpc @ index.cjs.js:13863
push../node_modules/@firebase/firestore/dist/index.cjs.js.PersistentStream.startStream @ index.cjs.js:13782
(anonymous) @ index.cjs.js:13769
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:185
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:185
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2969
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:255
scheduleMacroTaskWithCurrentZone @ zone.js:1114
(anonymous) @ zone.js:3001
proto.(anonymous function) @ zone.js:1394
Xg @ auth.esm.js:120
push../node_modules/@firebase/auth/dist/auth.esm.js.Ah.o @ auth.esm.js:141
Ih @ auth.esm.js:139
(anonymous) @ auth.esm.js:145
A @ auth.esm.js:13
Oh @ auth.esm.js:145
(anonymous) @ auth.esm.js:157
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:186
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:185
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:185
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:500
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
IndexedDB (async)
(anonymous) @ auth.esm.js:183
A @ auth.esm.js:13
dj @ auth.esm.js:183
ej @ auth.esm.js:184
push../node_modules/@firebase/auth/dist/auth.esm.js.g.set @ auth.esm.js:185
(anonymous) @ auth.esm.js:188
e.g @ auth.esm.js:17
Db @ auth.esm.js:20
zb @ auth.esm.js:20
push../node_modules/@firebase/auth/dist/auth.esm.js.g.Yb @ auth.esm.js:19
ib @ auth.esm.js:13
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:388
push../node_modules/zone.js/dist/zone.js.Zone.run @ zone.js:138
(anonymous) @ zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:188
drainMicroTaskQueue @ zone.js:595
Promise.then (async)
scheduleMicroTask @ zone.js:578
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:252
scheduleResolveOrReject @ zone.js:862
ZoneAwarePromise.then @ zone.js:962
push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule @ core.js:4791
./src/main.ts @ main.ts:13
webpack_require @ bootstrap:81
0 @ main.ts:14
webpack_require @ bootstrap:81
checkDeferredModules @ bootstrap:43
webpackJsonpCallback @ bootstrap:30
(anonymous) @ main.js:1
When I try to use this I get this error message.
More than one custom value accessor matches form control with unspecified name attribute
But I don't have any other in the project.
Tested with a new empty project (Angular CLI 1.5.0 and Angular 5)
ng new test-project
npm install ng-trim-value-accessor --save
(include like in README)
ng serve
ERROR in ./node_modules/ng-trim-value-accessor/index.ts
Module build failed: Error: [...]/node_modules/ng-trim-value-accessor/index.ts is not part of the compilation output. Please check the other error messages for details.
at AngularCompilerPlugin.getCompiledFile ([...]/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:629:23)
at plugin.done.then ([...]/node_modules/@ngtools/webpack/src/loader.js:467:39)
at process._tickCallback (internal/process/next_tick.js:109:7)
@ ./src/app/app.module.ts 9:0-65
@ ./src/main.ts
@ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts
Found a similar issue with workaround here:
angular/angular#20091
When I try to add [(ngModel)]
directive to mat-autocomplete, I get following warning.
ERROR Error: More than one custom value accessor matches form control with unspecified name attribute
This warning gets fixed if I remove the TrimValueAccessorModule
import to my module.
I can disable TrimValueAccessorModule
for the mat-autocomplete by adding class="ng-trim-ignore"
attribute to the input element of mat-autocomplete and fix the warning, but it would be better if TrimValueAccessorModule
could work with mat-autocomplete without a problem.
Seems that this accessor only changes the HTMLElement value.
The bound model value is not changed.
Tested in Angular v5.2.9
Are there any solution for this?
Not sure what the problem is exactly. I can't see anything in the code that would break the closure compiler, so I suspect it is something related with how the output lib files are generated. Maybe someone more proficient with the closure compiler can pitch in with the details.
Tried importing if both from esm2015 and fesm2015 packages.
When using esm2015, I've added this to closure.config:
--js node_modules/tslib/package.json
--js node_modules/tslib/tslib.js
--js node_modules/ng-trim-value-accessor/package.json
--js node_modules/ng-trim-value-accessor/esm2015/**.js
And this is the error I get:
CLOSURE ERROR ./out-tsc/src/app/app.module.ngfactory.js 31:
ERROR - Failed to load module "ng-trim-value-accessor"
import * as i30 from "ng-trim-value-accessor";
^
./out-tsc/src/app/shared/shared.module.js:22:
Originally at:
tmp/app/shared/shared.module.ts:22: ERROR - Failed to load module "ng-trim-value-accessor"
import {TrimValueAccessorModule} from "ng-trim-value-accessor";
^
When using fesm2015, I've added this to closure.config:
--js node_modules/tslib/package.json
--js node_modules/tslib/tslib.js
--js node_modules/ng-trim-value-accessor/package.json
--js node_modules/ng-trim-value-accessor/fesm2015/**.js
And this is the error I get:
CLOSURE ERROR ./node_modules/ng-trim-value-accessor/fesm2015/ng-trim-value-accessor.js 1:
ERROR - Failed to load module "tslib"
import { __decorate, __metadata } from 'tslib';
^
The only way I can get it not to break is with the fesm2015 version, and I change the tslib config to this:
--js node_modules/tslib/tslib.es6.js
And change the the package_json_entry_names from:
--package_json_entry_names es2015
to:
--package_json_entry_names es2015,jsnext:main
In that case it doesn't break, but produces a empty (0B) bundle.js file
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.