如何解决，Angular:ERROR TypeError:无法读取未定义的属性“name”

我有以下错误：

SingleUserComponent.html:13错误类型错误：无法读取Object.eval[as updateDirectives]SingleUserComponent.html:30处未定义的属性“name” 在Object.debugUpdateDirectives[作为updateDirectives]core.js:10750

这是我的密码：

model.ts

    import {User} from './user';
    export class Wallet {
    id: number;
    pname: string;
    puser: User;
    constructor(public name: string, public user: User) {
    this.pname = name;
    this.puser = user;
    }
    }

单用户组件.html

<div class="row">
  <div class="container">
    <div class="panel-primary">
      <h1 class="panel panel-heading">
        {{user.name}}

        <button class="btn btn-default pull-right" (click)="addWallet()">
          <span class="glyphicon glyphicon-plus"></span>
        </button>
      </h1>
      <div class="panel-body">
        <ul class="list-group-item">
          <li *ngFor="let wallet of user.wallets" style="list-style: none">
            <h3>
              {{wallet.name}}
              <button class="btn btn-sucess  pull-right" 
          (click)="deleteWallet()">
                <span class="glyphicon glyphicon-minus"></span>
              </button>
            </h3>
          </li>
        </ul>
    </div>

      <div class="form-group spacer">
      </div>
      <div class="form-group">
        <h3>Create new Wallet</h3>
        <form>
          <input type = "text" name = "walletName"
                 [(ngModel)] = "createdWallet.name" (click) = 
         "createdWallet.name = '' ">
          <button type="button" class="btn btn-success" 
        (click)="createWallets(user.id)" [disabled] = 
         "createdWallet.name?.length < 2">Add a new Wallet</button>
        </form>
      </div>
       <!-- <label for="name">
          Please choose a new Wallet !
        </label>-->
         <!-- <input id="name" class="form-control" 
        [(ngModel)]=selectedWallet.name>
         <button type="button" class="btn btn-success" 
       (click)="onAddWallet()">Add a new Wallet</button>
      </div>-->

          <!--  <select id="name" class="form-control btn" name="name" 
         [(ngModel)] = selectedWallet (click)="onSelectWallet()" >
              <option *ngFor="let wallet of wallets">{{wallet.name}}</option>
            </select>
          </label>

          <div *ngIf="selectedWallet">

            <li>{{selectedWallet}}</li>
          </div>-->
          <!-- <input  type="text" id="name" class="form-control" name="name" 
         ngModel="" required>-->


    <button class="btn btn-default spacer" (click)="onBack()">Back</button>
  </div>
</div>

---

谢谢你的回答

如我所见，您正在从api请求数据，api会同步返回数据，您可以使用安全导航操作符或ngIf按如下方式处理此问题

{{user?.name}}

---

查看您的错误消息，您必须在第30行的某处添加elvis运算符，不要忽略任何错误

没有在DOM中实际呈现的模板逻辑

另一个丑陋的选项是将所有变量初始化为空，但我建议您找到忘记的模板变量

您还可以使用异步管道直接从可观察对象获取模板中的值，这也将消除错误

另外，我刚刚意识到在HTML中，atributes和它们的值之间有空格

e、 g.name=walletName应为name=walletName

最好清理你的代码。上面的HTML应该可以解决这个问题

---

制作加密钱包

我添加了问号，但它仍然不起作用将它添加到绑定数据的所有位置您将有一个比此更好的解决方案。在这种情况下，将*ngIf添加到整个div*ngIf=userIt仍然不起作用。我觉得这个错误是由于我的.ts文件引起的

{{user?.name}}

<form>
  <input type = "text" name="walletName"
         [(ngModel)]="createdWallet?.name" 
         (click)="createdWallet?.name = '' "
  >
  <button type="button" class="btn btn-success" 
          (click)="createWallets(user.id)" 
          [disabled]="createdWallet?.name?.length < 2">
            Add a new Wallet
  </button>
</form>

 <li *ngFor="let wallet of user.wallets" style="list-style: none">
     <ng-container *ngIf="wallet">
        <h3>
          {{wallet.name}}
          <button class="btn btn-sucess  pull-right" (click)="deleteWallet()">
            <span class="glyphicon glyphicon-minus"></span>
          </button>
        </h3>
      <ng-container>
    </li>