Not able to receive option value in angular 2 function upon selection

Question

<form>
    <div class="form-group">
        <label for="sel1 primary"></label>
        <select class="form-control" id="sel1">
            <option *ngFor="let group of instanceList"(click)="change_group(group.name)" > <a href="#"> {{group.name}}</a> 
            </option>
        </select>
    </div>
</form>

Sorry for bad indentation. Instancelist list is the array of object contain, id, name, groupnumber. I want to get the value of selected option in my calling method and want to display it in console.

function change_group(groupname){
     this.change_to=groupname;
     console.log(change_to);
}

The problem is, the given function not even call upon selecting value in dropdown.

Dean Chalk · Accepted Answer · 2017-06-15 11:43:05Z

1

Why not leave the option tags alone and just subscribe to the selection changed event in the <select> tag

<select class="form-control" id="sel1" (change)="onGroupChange($event)">

answered Jun 15, 2017 at 11:43

Dean Chalk

20.5k6 gold badges66 silver badges95 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Günter Zöchbauer · Accepted Answer · 2017-06-15 11:24:53Z

1

(click) on <option> is usually not how to do it.

Use instead ngModel

<select class="form-control" id="sel1" ngModel (ngModelChange)="change_group($event)">
  <option *ngFor="let group of instanceList" [ngValue]="group"> <a href="#"> {{group.name}}</a> 
        </option>

answered Jun 15, 2017 at 11:24

Günter Zöchbauer

661k235 gold badges2.1k silver badges1.6k bronze badges

2 Comments

user2903536 Over a year ago

Template parse errors: Can't bind to 'ngValue' since it isn't a known property of 'option'. ("ge_group($event)"> Thanks for answering, actually this error occur

Günter Zöchbauer Over a year ago

You need to add the 'FormsModule` to imports: [...]

Collectives™ on Stack Overflow

Not able to receive option value in angular 2 function upon selection

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related