Question

更新：我的代码似乎没有用新值（输入字段“ newVb”中写入的值）更新所选值。它说，当涉及到“ this.selectedVarde = this.newVarde”行时，“ 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

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

这些是您组件定义的属性/变量

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

1 个答案: