How do I get a new selection in & ldquo; Select & rdquo; In angular 2?

综合编程 2018-09-25 阅读原文

I am using Angular 2 (TypeScript).

I want to do something for new selection, but what I got in onChange() is always last selection. How can I get new selection?

    {{i}}


onChange($event) {
    console.log(this.selectedDevice);
    // I want to do something here for new selectedDevice, but what I
    // got here is always last selection, not the one I just select.
}

If you don't need two-way data-binding:

    {{i}}


onChange(deviceValue) {
    console.log(deviceValue);
}

For two-way data-binding, separate the event and property bindings:

    {{i}}
export class AppComponent {
  devices = 'one two three'.split(' ');
  selectedDevice = 'two';
  onChange(newValue) {
    console.log(newValue);
    this.selectedDevice = newValue;
    // ... do other stuff here ...
}

If devices
is array of objects, bind to ngValue
instead of value
:

  {{i.name}}

{{selectedDeviceObj | json}}
export class AppComponent {
  deviceObjects = [{name: 1}, {name: 2}, {name: 3}];
  selectedDeviceObj = this.deviceObjects[1];
  onChangeObj(newObj) {
    console.log(newObj);
    this.selectedDeviceObj = newObj;
    // ... do other stuff here ...
  }
}

Plunker
- does not use



Plunker
- uses


and uses the new forms API

Hello, buddy!

责编内容by:Hello, buddy!阅读原文】。感谢您的支持!

您可能感兴趣的

Java URL of the REST API passed in AngularJS does ... I am new to AngularJS, i am trying to get the data using REST api url and i am trying to pass the URL to angularjs and d...
Real-World Angular Series – Part 3: Fetching... TL;DR:This 8-part tutorial series covers building and deploying a full-stack JavaScript application from the ground up ...
ngFor – Working with Large Lists in Angular ngFor is directive that iterates through a list of data and instantiates a template for each item in the list. It does a...
Customizing Angular CLI 6 build — an alternative t... So your Angular 6 project just went a bit beyond TODO app and you have to customize your build configuration. The...
Angularjs does not allow json not to work in Googl... I want to show you the list of the places in the area on the map. And with the following code I can show this, but I can...