Самый чистый способ сброса форм

Каков самый чистый способ сброса форм в Angular 2 последней версии? Я хотел бы сбросить текстовые поля ввода после добавления сообщения.Самый чистый способ сброса форм

@Component({ 
    selector: 'post-div', 
    template: ` 
      <h2>Posts</h2> 
      <form (submit)="addPost()"> 
       <label>Title: </label><input type="text" name="title" [(ngModel)]="title"><br/> 
       <label>Body: </label><input type="text" name="body" [(ngModel)]="body"><br/> 
       <input type="submit" value="Add Post"> 
      </form> 
      <ul> 
       <li *ngFor="let post of posts"> 
        <strong>{{post.title}}</strong> 
        <p>{{post.body}}</p> 
       </li> 
      </ul> 
      `, 
    providers: [PostService] 
}); 

addPost(){ 
    this.newPost = { 
     title: this.title, 
     body: this.body 
    } 
    this._postService.addPost(this.newPost); 
}

источник

2017-01-06 Safal Pillai

<form #myForm="ngForm" (submit)="addPost(); myForm.reset()"> ... </form>

Или:

<form #myForm="ngForm" (submit)="addPost(myForm)"> ... </form>

addPost(form: NgForm){ 
    this.newPost = { 
     title: this.title, 
     body: this.body 
    } 
    this._postService.addPost(this.newPost); 
    form.resetForm(); // or form.reset(); 
}

Добавление еще один пример для тех, кто не может получить выше для работы.

С нажатием кнопки:

<form #heroForm="ngForm"> 
    ... 
    <button type="button" class="btn btn-default" (click)="newHero(); heroForm.reset()">New Hero</button> 
</form>

То же самое относится и выше, вы также можете передать форму функции newHero.

источник

2017-05-15 17:45:57 smac89

Это не работает. Даже в угловом образце -> https://angular.io/guide/form-validation, если вы нажмете «Новый герой с перезагрузкой» во второй раз, он все равно покажет ошибку подтверждения «Имя требуется» ??? Шаги: нажмите «Новый герой», введите новые значения и снова нажмите «Новый герой». Ошибки проверки не должны появляться, поскольку форма была сброшена ??? – user1829319

@ user1829319, я не знаю, что вы подразумеваете под этим, что больше не работает. Если вы следуете этому [учебнику] (https://angular.io/guide/forms#show-and-hide-validation-error-messages), в нижней части раздела (до [этот раздел] (https: // angular.io/guide/forms#submit-the-form-with-ngsubmit)), вы увидите, что они сбросят форму точно так, как я показал. Вы должны увидеть, что они изначально имели что-то вроде '

Пробовали ли вы свои примеры на шагах, которые я объяснил? Я имею в виду, если форма сбрасывается и является нетронутой, тогда вы не должны получать ошибку проверки. – user1829319

простой и чистый способ очистить формы, а также их состояние ошибки (загрязнено, Prestine и т.д.)

this.form_name.reset();

для получения дополнительной информации о формах читайте здесь

https://angular.io/docs/ts/latest/guide/forms.html

PS: Как вы задали вопрос, нет формы используемый в вашем коде вопроса, вы используете простой двухдневный привязкой данных, используя ngModel, а не с formControl.

form.reset() метод работает только для formControls сброса называют

источник

2017-01-06 06:27:32

Самый чистый способ сброса форм

ответ

Смежные вопросы