想要将单选按钮 html 中选择的值传递给 controller javascript

Question

我正在尝试通过单选按钮将值从我的 html 传递到 controller。

html代码

<div>
<p>Please select your gender:</p>
  <input type="radio" id="male" name="gender" value="male" [(ngModel)]="male.value"
   ng-click="vm.valueSelected($event.target.value)">
  <label for="male">Male</label><br>

  <input type="radio" id="female" name="gender" value="female" [(ngModel)]="female.value"
   ng-click="vm.valueSelected($event.target.value)">
  <label for="female">Female</label><br>

<div>

controller

vm.valueSelected = function(value) {
            console.log('valueSelected', value);
}

当我尝试上述方式时，我在控制台上未定义“价值”

我尝试了很多例子http://plnkr.co/edit/4lvJclZuh0lryF1nhmdt?preview

https://plnkr.co/edit/?p=preview&preview

我只需要将选定的无线电值传递给 controller 不确定到底出了什么问题。

Answer 1

如果您通过 event.target.value 传递值，则将传递 value 字段。 在下面的示例中，如果因为 value="male" 而选择了男性，则会传递男性。 对于女性也是如此。 ngModel 用于在其中定义的字段中设置所选项目的值。

这对我有用。 我试过 Angular。

html

<div>
        <p>Please select your gender:</p>
          <input type="radio" id="male" name="gender" value="male" [(ngModel)]="male"
           (click)="valueSelected($event.target.value)">
          <label for="male">Male</label><br>

          <input type="radio" id="female" name="gender" value="female" [(ngModel)]="female"
           (click)="valueSelected($event.target.value)">
          <label for="female">Female</label><br>
        <div>

JS

valueSelected(value) {
    console.log('valueSelected ', value);
}

如果值集是male1，即value="male1"，则在控制台中将打印valueselected male1。