2014-01-08 4 views
5

Ich kann Radio-Buttons arbeiten und an ein Modell binden. Wenn die Seite geladen wird, wird jedoch kein Optionsfeld angezeigt, obwohl es ausgewählt ist.Probleme beim Arbeiten mit Radio-Taste in Angular Dart

Hier ist der Code 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)); 
} 

Und hier ist die Ansicht Markup. Sobald ich mit der Auswahl von Radios anfange, wird die Benutzeroberfläche korrekt aktualisiert und die Datenbindung funktioniert. Beim Laden der Seite wird jedoch nichts ausgewählt. Nicht sicher, warum das so ist.

<!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> 

Antwort

4

Ich habe Ihren Code versucht. Nach einigen Experimenten habe ich gesehen, dass das Umschalten der Reihenfolge der Attribute ng-model und value das Problem löst. Ich würde dies als einen Fehler betrachten.

<!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> 
+2

Ja, das ist ein Fehler :-(https://github.com/angular/angular.dart/issues/395 –