Angular - undefined zu null Feldkonvertierung

Question

Ich entwickle eine angular Anwendung mit spring Backend. Ich habe eine FormGroup wie folgt:

myForm = new FormGroup({ 
    fieldOne: new FormControl(), 
    fieldTwo: new FormControl(), 
    fieldThree: new FormControl() 
}); 

, die wie folgt auf dem Objekt übereinstimmt:

export class MyClass{ 
    firstField: number; 
    secondField: number; 
    thirdField: string; 
} 

Wenn ich das Formular abschicken ich etwas wie folgt aus:

this.firstField = myForm.value.fieldOne; 

Das Problem ist, dass Wenn die Felder nicht festgelegt sind, sind sie undefined. Dies verursacht ein Problem für den Back-End-Dienst, der das Objekt nicht deserialisieren kann, da es undefined, aber null nicht erwartet.

Dies könnte mein Problem lösen:

this.firstField = myForm.value.fieldOne ? myForm.value.fieldOne : null; 

aber wenn ich viele Felder haben, es ist wirklich nicht so elegant. Dann fand ich folgende Arbeiten:

export class MyClass{ 
    firstField: number = null; 
    secondField: number = null; 
    thirdField: string = null; 
} 

Es wäre perfekt. Meine Frage ist, seit ich javascript neu bin: ist das richtig? Gibt es eine weitere bewährte Methode, um diese Art von Konvertierung durchzuführen? Wie lösen Sie normalerweise diese Art von Serialisierungsproblemen zwischen Frontend und Backend? Vielen Dank.

Answer 1

Wie @Manu bemerkt hat können Sie Nullwerte zuweisen. Und Sie können auch Standardwerte definieren. Genau wie folgt

export class MyClass{ 
    firstField: number = 0; 
    secondField: number = 0; 
    thirdField: string = ''; 
} 

Also hier Sie nicht undefined oder null Wert behandeln müssen. Und das ist eine gute Methode, um solche Werte zu initialisieren.

Answer 2

Ich sehe kein Problem mit Ihrem Ansatz. Es ist das Standardverhalten, das für Formularwerte, die nicht festgelegt sind, nicht definiert wird. gemäß der Definition:

Die undefinierte Eigenschaft gibt an, dass eine Variable nicht einen Wert zugewiesen wurde.

Wenn Sie null als Standardwert zuweisen, dann ist JavaScript null "nichts". Es soll etwas sein, das nicht existiert. Gehen Sie also so vor, dass Sie alle Membervariablen als Null zuweisen, wenn das Backend nicht undefiniert arbeiten kann.

Hoffe, das hilft!

Answer 3

Wenn Sie eine sauberere Lösung wollen Sie eine init-Funktion in Ihrer Klasse machen könnte, die alle Ihre Werte null wie initialisieren wird:

export class MyClass{ 
    firstField: number; 
    secondField: number; 
    thirdField: string; 

    constructor() { 
     this.init(); 
    } 

    private init(): void { 
     Object.getOwnPropertyNames(this).forEach(
      (property) => { 
       this[property] = null; 
      } 
     ); 


} 

Answer 4

Sie können jedes Feld Wert auf Null gesetzt, falls sie nicht definiert sind:

var obj = new MyClass(); 
obj.firstField = myForm.value.fieldOne; 
obj.secondField = myForm.value.fieldTwo; 
//... 
Object.keys(obj).forEach(field => obj[field] = obj[field] || null);