Angular dart 单选按钮未绑定到模型答案

【问题标题】：Angular dart radio buttons not binding to modelAngular dart 单选按钮未绑定到模型
【发布时间】：2015-07-17 22:58:43
【问题描述】：

我有一个带有以下 html 的 Angular Dart 组件：

编辑：由于某种原因，我的一些 html 没有正确复制。在我拥有的标签标签之外：

<div class="btn-group btn-group-vertical" data-toggle="buttons">

    <label ng-repeat="item in items" class="btn btn-primary btn-sm btn-block" ng-show="isItemVisible(item)">

        <input type="radio" name="options" value="{{item}}" ng-model="selected">{{item}}
            <span class="badge pull-right"><span class="glyphicon glyphicon-ok"></span></span>

    </label>
</div>`

但是，这永远不会更新模型。我也尝试过使用 onclick、ng-click 和 ng-change 获得相同的结果——这些函数永远不会被调用。是否有一些我使用不正确的指令？

【问题讨论】：

嘿，您可能会考虑将 selected 设为 hte item 对象的一部分。像 ng-model="item.selected" 并为文本添加 item.text。
是的，下拉菜单也有同样的问题...执行回调时模型尚未更新... setTimeout 0 / 将来包装回调。

标签： html radio-button dart angular-dart

【解决方案1】：

在您的 ng-click 中使用 Future，这样您的模型就会得到更新。

    <input type="radio" name="options" value="{{item}}" 
         ng-model="selected" ng-click="radioButtonClicked();">{{item}}</input>

   //Component Code:
   void radioButtonClicked(){
            new Future((){
                //Use your selected model here.
            });
   }

【讨论】：

【解决方案2】：

$parent 应该可以解决问题。这是工作示例：

HTML

<div>
  <div ng-repeat="item in items">
    <label for="{{item.name}}">{{item.name}}:</label>
    <input id="{{item.name}}" type="radio" ng-model="$parent.$parent.selected" ng-value="item.value" />
  </div>

  <strong>Selected value:</strong> {{$parent.selected}} <br/>
</div>

控制器

$scope.items = [{
  name:'Item1',
  value: 'value1'
}, {
  name:'Item2',
  value: 'value2'
}, {
  name:'Item3',
  value: 'value3'
}];

$scope.selected = null;

【讨论】：

这可能不适用于我的问题，因为我正在使用 AngularDart。我的控制器是一个 Dart 组件。