angularjs - 根据AngularJS中的单选按钮选择启用/禁用按钮

Question

我在单选按钮列表(使用ng-repeat)中带有button(最初被ng-disabled禁用)的项目继续。选择单选按钮时，我要启用“继续”按钮。

在Angular中执行此操作的正确方法是什么？

相关JS:

$scope.companies = [{
        "id": 3,
        "name": "Twitter"
    }, {
        "id": 2,
        "name": "Google"
    }, {
        "id": 1,
        "name": "Apple"
    }]

相关HTML:

<table>
  <tr ng-repeat="company in companies">
     <td>
       <input type="radio" ng-model="companyId" name="companyId" value="{{company.id}}" />{{company.name}}
      </td>
  </tr>
</table>

<button ng-disabled="!companyId">Continue</button>

Jsfiddle

谢谢!

Answer 1

ngRepeat创建一个新的作用域，它是按钮使用的作用域的子作用域。您可以使用修复它

<input type="radio" ng-model="$parent.companyId" .../>

参见 http://jsfiddle.net/UZkM8/1/

但是更好的解决方案是更新已经在范围内的对象:

$scope.userChoice = {};

<input type="radio" ng-model="userChoice.companyId" .../>

<button ng-disabled="!userChoice.companyId">Continue</button>

参见 http://jsfiddle.net/UZkM8/3/