Angular 14: <my-select><option [ngValue]=1>val1</option> not working as expected

63 views
Skip to first unread message

barack.obama

unread,
Aug 23, 2023, 3:49:01 PM8/23/23
to Angular and AngularJS discussion
Hi,

I've noticed that angular 14 drop down lists do not work as expected if the list is created by a custom class. E.g.:  (some quotes removed for brevity)

<my-select formControlName=foo>
  <option value=1>val1</option>
 ...
</my-select>



First or all [ngValue] does not set the value property on the option field. Instead I have to set the value as: <option *ngFor=let foo of foos [value]=foo.value>{{foo.text}}</option>. This is certainly a bug or my misunderstanding of how ngValue works. Anyway:

Second Even though the above snippet correctly sets the value to 1, if val1 is selected, I cannot set the initial value, neither in the ngOnInit() nor in the ngOnViewInit() - well, I can set it there (debugger shows that the inputField.value is correct), but the component doesn't show it unless I add a ngAfterViewChecked(): { this.form.patchValue(this.form.value) } which finally updates the view with the value it already has.

Does angular 14 has any code which avoids updating the view if a inputField.value=1 is set? Probably it thinks that it should by value1? Why do I have to force the value in afterViewChecked with the same value it already has, just to update the view?

Indeed, if I ommit [value] altogether, and I set val1, everything works as expected.

Reply all
Reply to author
Forward
0 new messages