输入字段无法访问 - 无法读取未定义的属性“值”

时间:2017-09-05 08:30:01

标签: angular

我有一个包含以下内容的md-list:

<md-list-item *ngIf="passwortEditable" class="input-list-item">
            <md-icon md-list-icon>lock</md-icon>
            <md-input-container class="margin-left-16">
              <input #inputAltesPasswort mdInput title="Aktuelles Passwort" type="password" placeholder="Aktuelles Passwort"
                     (keyup.enter)="savePasswort(inputAltesPasswort?.value, inputNeuesPasswort?.value,
                     inputPasswortWiederholung?.value)" (keyup.escape)="passwortEditable=false">
            </md-input-container>
          </md-list-item>
          <md-list-item *ngIf="passwortEditable" class="input-list-item">
            <md-icon md-list-icon>lock</md-icon>
            <md-input-container class="margin-left-16">
              <input #inputNeuesPasswort mdInput title="Neues Passwort" type="password" placeholder="Neues Passwort"
                     (keyup.enter)="savePasswort(inputAltesPasswort?.value, inputNeuesPasswort?.value,
                     inputPasswortWiederholung?.value)" (keyup.escape)="passwortEditable=false">
            </md-input-container>
          </md-list-item>
          <md-list-item *ngIf="passwortEditable" class="input-list-item">
            <md-icon md-list-icon>lock</md-icon>
            <md-input-container class="margin-left-16">
              <input #inputPasswortWiederholung mdInput title="Passwortwiederholung" type="password" placeholder="Neues Passwort wiederholen"
                     (keyup.enter)="savePasswort(inputAltesPasswort?.value, inputNeuesPasswort?.value,
                     inputPasswortWiederholung?.value)" (keyup.escape)="passwortEditable=false">
            </md-input-container>
          </md-list-item>
          <md-list-item *ngIf="passwortEditable">
            <button md-raised-button color="accent" (click)="savePasswort(inputAltesPasswort?.value, inputNeuesPasswort?.value,
               inputPasswortWiederholung?.value)" class="margin-left-20">ÜBERNEHMEN</button>
            <button md-raised-button  (click)="passwortEditable=false" class="margin-left-20">ABBRECHEN</button>
          </md-list-item>

savePasswort函数中,我尝试从三个输入字段中读出值。当我将所有输入字段放在同一md-list-item时,这很有效。现在我出于造型原因将它们分开,每个md-list-item(你可以在上面看到)。但现在,angular无法访问我的输入字段。我认为原因是,它们“隐藏”在不同的*ngIf后面。有解决方案可以解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

有一个简单的解决方案。问题是确实使用了不同的* ngIf。当我将md-list-item包装在受控制的div中时,它可以运行* ngIf。