2017-11-09 1 views
2

ein Radiobutton HTML-Element in einer Winkel Anwendung BetrachtenSind [(ngModel)] Bindungen immer Zeichenfolgen?

<div class="radio"> 
    <label> 
     <input type="radio" name="approvedeny" value="true" [(ngModel)]=_approvedOrDenied> 
     Approve 
    </label> 
    </div> 

Auf unserer Komponente, die _approvedOrDenied Eigenschaft als boolean deklariert.

@Component({ 
export class ApprovalsComponent implements OnInit { 
    _approvedOrDenied: boolean; 

Wenn Sie jedoch durch den clientseitigen Code gehen, wird dieser auf eine Zeichenfolge gesetzt. Es gibt keine Umwandlungen in meinem Code, die das tun würden, es scheint, als würde eckig es automatisch machen.

enter image description here

Sind alle Databound-Eigenschaften als Strings in Winkel zurückgegeben? Und wenn ja, warum sollte der Typ _approvedOrDenied: boolean in Typoskript deklariert werden?

+0

Ich denke, es ist wegen 'value =" true "' m versuchen stattdessen '[value] =" true "' –

+0

offizielle Dokumentation sagt, dass das Modell ein 'any' Typ ist https://angular.io/api/forms/NgModel –

Antwort

6

Nein, es ist nicht immer ein String arbeiten. Und übrigens, das ist das erste Mal, dass ich ein Tag ohne Anführungszeichen sehe!

Wenn Sie machen einen compoment mit einem Eingang wie dieses

<app-my-component firstVariable="hello world"></app-my-component> 

Dann ist es ein String. Sie können in diesem Fall nicht einmal eine Variable angeben, die Eingabe hat den Namen der Variablen als Wert.

Aber wenn Sie

<app-my-component [firstVariable]="hello world"></app-my-component> 

tun Dann wird es nicht funktionieren. Denn hier soll man eine Variable geben. Damit es funktioniert, verwenden Sie diese

<app-my-component [firstVariable]="'Hello world'"></app-my-component> 

Jetzt sind Sie so etwas wie eine „anonyme Variable“ geben: Sie verwenden Anführungszeichen, so Angular versteht es ist eine Zeichenfolge.

In Ihrem Fall verwenden Sie eine Optionsschaltfläche. Optionsfelder sind Teil von Optionsfeldgruppen und haben jeweils Zeichenfolgenwerte. Selbst wenn du wahr schreibst, heißt das nicht, dass es ein Boolescher Wert ist! Wenn Sie einen Boolean geben möchten, müssen Sie

verwenden
[value]="true" 

Ich hoffe, ich habe geholfen!

+0

Danke, ja das hat für mich funktioniert. Ich werde es noch einmal durchlesen und versuchen zu verdauen, was du sagst. Was meinst du "das ist das erste Mal, dass ich ein Tag ohne Anführungszeichen gesehen habe"? Meinst du diese Zeile: '[(ngModel)] = _ approvedOrDenied' (im Gegensatz zu" _approvedOrDenied "') –

+0

ja das ist, was ich meinte, ich habe nie Zitate verwendet, also ist es ein wenig überraschend für mich, aber ich Freut mich zu erfahren, dass es so funktioniert! Ich werde ab jetzt 2 Tastenanschläge speichern: p – trichetriche

+0

Vorbehalt: es * scheint * zu funktionieren. Ich hatte anfänglich Zitate, aber während ich hier debuggte, entfernte ich sie. Das soll nicht heißen, dass ich als Ergebnis nicht etwas anderes kaputt gemacht habe :) Aber der Code kompiliert und läuft so ... –

0

value="true" vom html entfernen und es sollte

+0

Also habe ich das getan und der Radio-Button funktioniert nicht richtig. IE Ich kann nicht auf die Schaltfläche "Genehmigen" klicken, sie bleibt bei "Deny" hängen. –

+0

Sorry es hat nicht funktioniert :( – Venomy

+0

np bud, danke für den Versuch, mir zu helfen :) –

Verwandte Themen