Question

我正在尝试将选择值发送到javascript，但是我收到“未定义”。

示例：

this._foos = [
{Name:'Foo1', Value: 1},
{Name:'Foo2', Value: 2},
{Name:'Foo3', Value: 3},
{Name:'Foo4', Value: 4}
]

我正在使用* ngFor来显示下拉列表选项。

我现在想将Value发送给组件，但是我无法弄清楚如何。

HTML：

<select [(ngModel)]="foo" name="foo" class="form-control" (change)="selectFoo(foo.Value)">
 <option *ngFor="let foo of _foos">{{foo.Name}}</option>
</select>

JS：

我使用（更改）事件尝试了以下内容：

 selectFoo(fooVal: any) { // any - is replaced by actual Object type in actual code
        // get supp obj from list
        console.log(fooVal); // it is undefined
    }

Answer 1

您必须将值绑定到[value]属性绑定

<select [(ngModel)]="fooValue" name="foo" class="form-control" (change)="selectFoo(fooValue)">
 <option *ngFor="let foo of _foos" [value]="foo.Name" >{{foo.Name}}</option>
</select>

Demo

Answer 2

您正在打印'foo'对象，但是您正在传递'fooVal'参数。

console.log(fooVal);

可以正常使用

* ng无法在更改组件时发送属性值

2 个答案: