值未更新 Angular 7 TS

Question

更新：我的代码似乎没有用新值（输入字段 "newVb" 中写入的值）更新所选值。它说 'this.newVarde' 在 'this.selectedVarde = this.newVarde' 行时未定义。最后它会添加一个新值而不是更新所选值。但是为什么，我不明白...

.ts

export class RightMenuComponent implements OnInit {

  public selectedVarde: this.selectedVarde;
  public newVarde: Varde;



  constructor(private _vardeService: VardeService) {
  }

updateVarde() {


    var beskrivning = this.selectedVarde;
    var newVarde = (<HTMLInputElement>document.getElementById('newVb')).value;


   this.varde = {

     Beskrivning: newVarde,
   }


    this.selectedVarde = this.newVarde;
    this._vardeService.updateVarde(this.varde).subscribe(() => { console.log("Lyckat") });


  }

然后是我的.html:

<label for="updateVarde">T:Värdet som du vill uppdatera</label>
            <select [(ngModel)]="selectedVarde" id="selectedVarde" name="updateVarde" class="form-control" required >
              <option *ngFor="let varde of allaVarden" [ngValue]="varde">{{varde.beskrivning}}</option> 
            </select>
            <button type="button" class="btn btn-primary" (click)="updateVarde()" style="margin-left:4%;" data-toggle="modal" data-target="#vardeModal" data-dismiss="modal">T:Redigera valt värde</button>
            <label for="beskrivning">T:Nytt värde: </label>
            <input class="input" style="width:10%;" id="newVb" type="text">

非常感谢有关代码错误的任何提示

Answer 1

它是正确的，它是未定义的，因为你没有为它设置值。

这些是您定义的组件properties/variables

public selectedVarde: Varde;
public newVarde: Varde;
public beskrivning: Varde;

然后您在方法中定义并初始化了具有相同名称的新作用域变量。

var beskrivning = this.selectedVarde;
var newVarde = (<HTMLInputElement>document.getElementById('newVb')).value;

this.varde = {
 Beskrivning: newVarde,
}

因此您到达以下行 this.newVarde 仍然未定义

this.beskrivning = this.newVarde;

编辑：

您可以使用已经定义的变量，而不是创建新变量。

this.beskrivning = this.selectedVarde;
this.newVarde = (<HTMLInputElement>document.getElementById('newVb')).value;

this.varde = {
 Beskrivning: this.newVarde,
}

编辑 2：

既然你的方法newVarde中的updateVarde没有引用你的组件中的newVarde那么你必须在方法中声明和初始化它。

this.beskrivning = this.selectedVarde;
const newVarde = (<HTMLInputElement>document.getElementById('newVb')).value;

this.varde = {
 Beskrivning: newVarde,
}

值未更新 Angular 7 TS

Value does not get updated Angular 7 TS

insert-update

typescript

asp.net-core

angular