Question

我正在尝试制作一种创建新播放器的方法。但是当我在输入中写一些内容并提交我的应用程序时什么都不做（只刷新页面）。

这是我的代码：

service.ts

import { Injectable } from '@angular/core';
import { Player } from './player';
import { WhitePlayers } from './mock-players';

@Injectable()
export class PlayersService {
  WhitePlayers: Player[];
  name;
  constructor() { }
    getPlayers(): Promise<Player[]> {
        return Promise.resolve(WhitePlayers);
    }

  createPlayer(): void {
    this.WhitePlayers.push(new Player(this.name));
  }

}

component.ts

addPlayer(): void {
      this.playersServices.createPlayer();
    }

component.html

<form (submit)="addPlayer()" novalidate>
    <md-input-container>
      <input mdInput [(ngModel)]="name" placeholder="Add player" name="addNewPlayer">
    </md-input-container>
      <button type="submit">Add</button>
</form>

非常感谢您的答案：）

Answer 1

如果刷新页面，则会再次初始化该字段中的值。

您可以将按钮类型更改为button以避免这种情况。

<button type="button">Add</button>

<小时/> 您还应该检查表单文档。您可以将表单绑定到模型，并使用ngSubmit在此过程中使用更多Angular方式。

https://angular.io/guide/forms#submit-the-form-with-ngsubmit

Angular2服务方法从输入

1 个答案: