Components: Adding mat-option dynamically to mat-select from .ts file(Using JavaScript)

[ramkumar93]

Bug, feature request, or proposal:

Adding or Creating 'mat-option' dynamically to 'mat-select' from .ts file(using JavaScript).

Is it possible to create or add 'mat-option' dynamically?

What is the expected behavior?

Need to create or add 'mat-option' dynamically from .ts file using JavaScript.

What is the current behavior?

Currently we can add 'mat-option' using *ngFor.

"

{{topping}}

"

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular: 5.2.3
angular-material: 5.1.1
Windows 10
typescript: 2.7.1
All Browsers

[WizardPC]

Yes it's possible.

this.toppingList.unshift("newValue"); or this.toppingList.push("newValue");

[ramkumar93]

Yes, we can add values to the toppingList array. But, I need to add "mat-option" element to the template using JavaScript.

[WizardPC]

@ramkumar93 I'm not sure to understand...

You have a select element, with multiples options (equals to toppingList size) generated by the for loop. If you want to add another option to this select just grow your list (toppingList here).

If it's not your goal, describe it with an example or a picture of what you want to achieve. And better ask it on StackOverflow :+1:

[crisbeto]

Please keep GitHub issues for bug reports / feature requests. Better avenues for troubleshooting / questions are stack overflow, gitter, mailing list, etc.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}