Angular Material 单选按钮模型未更新

Question

我正在使用带有 ng-repeat 的 Angular Material 无线电组，但我无法让 ng-model 更新为 selection。这是我当前的实现，但我也尝试过 ng-model="$parent.effectSelected"

在代码的更下方，我有一个函数，当用户单击一个按钮时，我使用 select 的值来评估后续步骤，但它始终记录为 'one'，这是我最初设置的。

我的HTML:

<md-radio-group ng-model="effectSelected" class="effect-radio-group">
  <md-radio-button class="effect-btn" ng-repeat="effect in effects" ng-value="effect.value">{{effect.name}}</md-radio-button>
</md-radio-group>

<md-button ng-click="checkSelection()">Evaluate</md-button>

我的控制器 JS：

   $scope.effects = [{'name':'None', 'value': 'one'},{'name':'Maybe', 'value': 'two'},{'name':'Yes', 'value': 'three'}];
   $scope.effectSelected = $scope.effects[0].value;
   $scope.checkSelection = function () {
       console.log($scope.effectSelected);
   }

Answer 1

好吧，问题在于您没有将收音机封装在对象中。要运行您的代码，需要执行以下操作：

我的HTML:

<md-radio-group ng-model="effectSelected.selected" class="effect-radio-group">
  <md-radio-button class="effect-btn" ng-repeat="effect in effects" ng-value="effect.value">{{effect.name}}</md-radio-button>
</md-radio-group>

<md-button ng-click="checkSelection()">Evaluate</md-button>

我的控制器 JS：

   $scope.effects = [{'name':'None', 'value': 'one'},{'name':'Maybe', 'value': 'two'},{'name':'Yes', 'value': 'three'}];
   $scope.effectSelected = { selected:'one'}
   $scope.checkSelection() = function () {
       console.log($scope.effectSelected.selected);
   }

希望对你有帮助 ;D

Answer 2

我为你准备了一个JSFiddle。

另外我认为你有一个语法错误：

$scope.checkSelection() = function () {
       console.log($scope.effectSelected);
   }

应该是

$scope.checkSelection = function () {
       console.log($scope.effectSelected);
   }

https://jsfiddle.net/HB7LU/20182/

Angular Material 单选按钮模型未更新

Angular Material Radio Button model not updating

javascript

radio-button

angularjs

angular-ngmodel