CODEWITHSUNDEEP
formsangular
James
James

Reputation: 2860

Angular2 select box passing object as a string

I am currently building some functionality in an Angular2 component where an array of objects is looped through to create the options for a form select box.

I have this working and when the select box option is changed I call a handler function which I intend to pass the chosen option through to.

The problem I am having at the moment is that I cannot get the object to pass through from the view to the controller. The object is passed though as a string:

[object object]

Here is my code:

view:

        <div class='searchbar-wrapper'>
            <h5>MANUFACTURER</h5>
            <select class='manufacturers' #m [(ngModel)]="selectedManufacturer" (change)="changeManufacturer(m.value)">
                <option>-- please select --</option>
                <option *ngFor="let manufacturer of manufacturers" [ngValue]="manufacturer">{{manufacturer.name}}</option>
            </select>
        </div>

controller:

changeManufacturer(manufacturer) {
    this.productsLoaded = false;
    this.selectedManufacturer = manufacturer;
    this.productPayload.manufacturer = manufacturer.id;
    this.getProducts();
}

As you can see, I am trying to pass the object through to the controller but this isn't working. Can anyone suggest as to why it is getting passed through as as string?

Thankss

Upvotes: 0

Views: 726

Answers (1)

James
James

Reputation: 2860

I managed to get this working my changing the following line from:

<select class='manufacturers' #m [(ngModel)]="selectedManufacturer" (change)="changeManufacturer(m.value)">

to:

<select class='manufacturers' [(ngModel)]="selectedManufacturer" (ngModelChange)="changeManufacturer($event)">

Upvotes: 1

Related Questions