获取由 ng-repeat 创建的输入的价值答案

【问题标题】：getting value of inputs created by ng-repeat获取由 ng-repeat 创建的输入的价值
【发布时间】：2017-01-30 22:52:45
【问题描述】：

我创建了一个单选按钮输入，但努力获取所选输入的值。

这是我创建的单选按钮输入

<ul ng-repeat="item in riskModel">
    <li>
      <input type="radio" name="rdbRisk" ng-value="{{item.value}}" />
      {{item.text}}
    </li>
</ul>

这是控制器中的 ng-model 定义

$scope.riskModel = [
        { id: 0, text: "A", value: "" },
        { id: 1, text: "B Risk", value: "YR" },
        { id: 2, text: "C Risk", value: "OR" },
        {id:3,text:"D Risk",value:"DR"}
    ]

我想获取选定的值并将其作为参数发送到函数，但到目前为止我没有得到任何结果。

【问题讨论】：

ng-value="{{item.value}}" 应该是ng-value="item.value"

标签： angularjs radio-button angularjs-ng-repeat

【解决方案1】：

将您的ng-model 变量声明为对象$scope.radioModel = {};

var myApp = angular.module('myApp',[]);

myApp.controller('GreetingController', ['$scope', function($scope) {
  //$scope.radioModel = {};
  $scope.riskModel = [
        { id: 0, text: "A", value: "" },
        { id: 1, text: "B Risk", value: "YR" },
        { id: 2, text: "C Risk", value: "OR" },
        {id:3,text:"D Risk",value:"DR"}
    ]
  $scope.changeValue = function(value){
    console.log(value.selected);
  }
  
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
  <div ng-controller="GreetingController" ng-init="radioModel={}">
    Get selected value : {{radioModel.selected}}
  <ul ng-repeat="item in riskModel">
    <li>
      <input type="radio" ng-model="radioModel.selected" name="rdbRisk" ng-value="item.value" ng-change="changeValue(radioModel)"/>
      {{item.text}}
    </li>
</ul>
</div>
</body>

【讨论】：

我正在将值写入控制台，它们起初工作得很好。但是当我第二次单击单选按钮时，值不会写在控制台上。
@EgeBayrak 试试我的例子
@EgeBayrak 我认为您应该使用 ngChange 在您的控制器中获取选定的值，请参阅我的回答我还控制台以获取选定无线电的值。如果您仍然遇到任何问题，请告诉我。
@EgeBayrak : 很高兴看到这一点，终于对你有用了 :)
一件小事，不知何故，我选择的输入在圆圈内没有黑点，因此无法查看选择了哪个选项。实际上我之前从未在单选按钮中遇到过这样的事情

【解决方案2】：

你忘了ng-model

<input type="radio" ng-model="selectedValue" name="rdbRisk" ng-value="item.value" />

使用$scope.selectedValue访问控制器

【讨论】：

【解决方案3】：

不要在输入中使用表达式{{}}，

<input type="radio" name="rdbRisk" ng-value="item.value" />

DEMO

最好的选择是使用 ng-model 并获取选定的值，

  <input type="radio" ng-model="selected" name="rdbRisk"     ng-click="display(selected)" />

DEMO

【讨论】：

好的，但我仍然不知道如何获取输入值。我应该使用类似 ng-change 的东西吗？不确定它是否可以在 ng-repeat tbh 中工作。
@EgeBayrak 使用 ng-click

【解决方案4】：

显示your working example的小提琴：

在您的input 上，添加一个ng-model，这将是您要保存选择的位置，并删除{{item.value}} 上周围的{{}}。

<li>
  <input type="radio" 
        ng-model="mySelection.selected" 
        name="rdbRisk"
        ng-value="item.value" />
  {{item.text}}
</li>

【讨论】：