angularjs – 使用Angular Dart中的单选按钮时出现问题

发布时间：2020-12-17 10:26:30 所属栏目：安全来源：网络整理

导读：我可以使单选按钮工作并绑定到模型.但是,当页面加载时,即使有一个单选按钮,也没有显示选中的单选按钮. 这是Dart代码： import 'package:angular/angular.dart';@NgDirective( selector: '[my-controller]',publishAs: 'ctrl')class MyController { ListStrin

我可以使单选按钮工作并绑定到模型.但是,当页面加载时,即使有一个单选按钮,也没有显示选中的单选按钮.

这是Dart代码：

import 'package:angular/angular.dart';

@NgDirective(
  selector: '[my-controller]',publishAs: 'ctrl'
)
class MyController {
  List<String> fruits = ['apple','banana','kiwi'];
  String favorite;

  MyController() {
    favorite = fruits[1];
  }
}

main() {
  ngBootstrap(module: new Module()..type(MyController));
}

这是视图标记.一旦我开始选择无线电,UI就会正确更新,数据绑定也能正常工作.但是在页面加载时没有选择任何内容.不知道为什么会这样.

<!DOCTYPE html>
<html ng-app>
  <body>
    <div my-controller>            
      <div ng-repeat="fruit in ctrl.fruits">
        <input type="radio"
            name="fruits"
            ng-model="ctrl.favorite" 
            value="{{fruit}}">{{fruit}}
      </div>
      <div>{{ctrl.favorite}} is my favorite</div>
    </div>

    <script type="application/dart" src="main.dart"></script>
    <script type="text/javascript" src="packages/browser/dart.js"></script>
  </body>
</html>

我试过你的代码.经过一些实验后,我看到切换属性ng-model和value的顺序解决了问题.我认为这是一个错误.

<!DOCTYPE html>
<html ng-app>
  <body>
    <div my-controller>
      <div ng-repeat="fruit in ctrl.fruits">
        <input type="radio"
            name="fruits"
            value="{{fruit}}"
            ng-model="ctrl.favorite"
            >{{fruit}}</div>
      <div>{{ctrl.favorite}} is my favorite</div>
    </div>

    <script type="application/dart" src="main.dart"></script>
    <script type="text/javascript" src="packages/browser/dart.js"></script>
  </body>
</html>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!