Question

我正在尝试为带有值的无线电输入创建指令。这些值将从指令传递。我还想在单选按钮更改时更新控制器中的值。这就是我想出来的......

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

app.controller('MainCtrl', function($scope) {
  $scope.selected = 1;
  $scope.values = [
    1,2,3,4
    ];
  $scope.update=function(){
    console.log("the value is "+ $scope.selected)
  }
})
.directive('jgRadio', function() {
    return {
      restrict:"E",
      scope:{
        values:"=",
        selected:"=",
        update:"&"
      },
      template: '<input ng-repeat="item in values" type="radio" value="{{item}}" ng-model="$parent.selected" ng-change="update()"></input>'
    };
  });

但控制台日志输出先前选择的（plunker）

有人能看到我错过的东西吗？

Answer 1

我认为是子范围继承问题的典型案例。将模型绑定更改为包含所选值的对象，并将对象绑定为双向绑定： -

$scope.selected = {value: 1};

并从您的指令中删除丑陋的$parent @ $parent.selected至selected.value

 <input ng-repeat="item in values" type="radio" ng-value="item" ng-model="selected.value" ng-change="update()"></input>

<强> Plnkr

原因是，在运行ng-change之后，需要运行摘要周期以更新指令使用者的双向绑定值。只有在ng-change函数的评估完成后，摘要周期才会运行。因此，在您的函数中，当您在父控制器中执行console.log($scope.selected)时，双向绑定变量的值尚未在父作用域上更新。因此，您会看到console.log显示范围上的先前值，并且在摘要周期后绑定仍会更新。将双向绑定范围变量和父控制器范围变量绑定到双向绑定范围变量和父控制器范围变量时，双向绑定范围变量和父控制器范围变量都指向相同的对象引用，并且更改会立即反映，也更喜欢使用ng-value对{ {1}}尤其是在处理无线电输入时。

将给定表达式绑定到input [select]或input [radio]的值，以便在选择元素时，将该元素的ngModel设置为绑定值。

Answer 2

我的解决方案： http://plnkr.co/edit/FcivQTotZAyjh5EvFNRr

  $scope.update=function(){
    $timeout(function(){
      console.log("the value is "+ $scope.selected);
    })
  }

单选按钮返回ngchange中的上一个值

2 个答案: