Question

我有一个地址管理应用，我正在尝试保存ngSubmit上的更改。但是，它说我的功能不是功能。我的HTML：

<div class="form">
  <h4>{{title}}</h4>
  <div class="form-container">
   <form (ngSubmit)="addFriend()">

    <div class="form-group">
        <label for="id">Id</label>
        <input type="text" name="id" [(ngModel)]="friend.id"
        [disabled]="friend.id" class="form-control" required />
    </div>

    <div class="form-group">
        <label for="name">Name</label>
        <input type="text" name="name" [(ngModel)]="friend.name"
                            class="form-control" required />
    </div>


    <div class="form-group">
        <label for="address">Address</label>
        <input type="text" name="address" [(ngModel)]="friend.address"
                            class="form-control" required />
    </div>

    <div class="form-group">
        <label for="phone">Phone</label>
        <input type="text" name="phone" [(ngModel)]="friend.phone"
                            class="form-control" required />
    </div>

    <div class="form-group">
      <a class="btn btn-default" routerLink="">Cancel</a>
      <button class="btn btn-primary" >Save</button>
  </div>

  </form>
  </div>
</div>

我在html中做错了吗，还是问题出在其他地方？

在我的service.ts文件中定义了addFriend函数。

Answer 1

您必须像这样在组件ts文件中定义addFriend

addFriend(){
//some work here
}

Answer 2

您的组件模板无权访问您的服务，而只能访问您的组件类方法。

所以你需要 1 /将服务注入您的组件 2 /在您的组件中定义一个调用服务方法的方法

例如在您的组件中：

constructor(private friendsService: FriendsService) {}
....
addFriend(){
    return this.friendsService.addFriend();
}

ngSubmit“ myFunction不是函数”打字稿，角度

2 个答案: