У меня возникли проблемы с отправкой формы. - PullRequest
Новая
       9

У меня возникли проблемы с отправкой формы.

0 голосов
/ 28 февраля 2020

Я хочу отправить форму по нажатию кнопки, а также перейти на следующую страницу, но на ней отображается ошибка: «Отправка формы отменена, поскольку форма не подключена» .

Может кто-нибудь помочь мне с этой проблемой ?? Я использую nebular.

Это код html 

            <nb-step [label]="labelOne" [stepControl]="formOne">
        <ng-template #labelOne>Device type</ng-template>
        <form class="form-inline" #formOne="ngForm" >

            // Code goes here...

            <div class="buttonHolder">
                <button nbButton routerLink="/dashboard" nbStepperNext>Cancel</button>
                <button nbButton outline status="primary" (ngSubmit)="onSubmit(formOne)" 
                  nbStepperNext [disabled]="!formOne.valid">Next</button>
            </div>
        </form>
    </nb-step>`

Это код .ts 

    onSubmit(form: NgForm) { console.log(form.value); form.reset(); }

Ответы [ 2 ]

1 голос
/ 28 февраля 2020

Чтобы изменить страницу после отправки формы, попробуйте импортировать Router и зарегистрировать ее в constructor(private _router: Router) в своем файле .ts.

В конце метода onSubmit() добавьте this._router.navigateByUrl('/pathOfYourNextPage'); и в этом как вы будете перенаправлять через ваш .ts файл.

Надеюсь, это поможет!

0 голосов
/ 28 февраля 2020

Вы можете попробовать ниже способ ts файл 

 onSubmit(formOne: NgForm) { 
   console.log(formOne.value); 
   this._router.navigate(['/navigation page link']); // navigation url link 
   formOne.reset(); 
 }

constructor(){
  private _router: Router,
}

HTML файл 

<nb-step [label]="labelOne" [stepControl]="formOne">
    <ng-template #labelOne>Device type</ng-template>
    <form class="form-inline" #formOne="ngForm"  (ngSubmit)="onSubmit(formOne)" >

        // Code goes here...

        <div class="buttonHolder">
            <button nbButton routerLink="/dashboard" nbStepperNext>Cancel</button>
            <button nbButton type= "submit" outline status="primary"  
              nbStepperNext [disabled]="!formOne.valid">Next</button>
        </div>
    </form>
...