Angular FormGroup onSubmit не попадает в - PullRequest
0 голосов
/ 02 августа 2020

на прошлой неделе этот код работал, а теперь нет. Я попытался установить точки останова на onSubmit () в .ts, но он никогда не попадал в инструменты chrome dev, и я понятия не имею, почему. Я использую firebase для загрузки деталей проекта на страницу проекта, но основная проблема заключается в том, что отправка не работает, и она работала на прошлой неделе. Я не менял код.

onSubmit() {
    console.log(
      {
        arrVal: this.categoriesFormArraySelectedIds,
      },
      null,
      2
    );

    this.newProject.projectName = this.form.get('name').value;
    this.newProject.projectDescription = this.form.get('description').value;
    this.newProject.interests = this.categoriesFormArraySelectedIds;
    this.firestoreService.createProject(this.newProject);
    // Add snackbar
  }
<mat-dialog-content>
  <div class="container-fluid">
    <div class="row justify-content-md-center">
      <div class="col-md">
        <div class="mt-4"></div>
        <form [formGroup]="form" (ngSubmit)="onSubmit()">
          <div class="form-group">
            <label>Project name</label>
            <input
              type="text"
              class="form-control"
              [class.is-invalid]="f['name'].invalid"
              formControlName="name"
              [(ngModel)]="newProject.projectName"
            />
            <div class="invalid-feedback mt-2" role="alert">
              Project name is required.
            </div>
          </div>

          <div class="form-group">
            <label>Project description</label>
            <textarea
              class="form-control"
              [class.is-invalid]="f['description'].invalid"
              formControlName="description"
            >
            </textarea>
            <div class="invalid-feedback mt-2" role="alert">
              Project name is required.
            </div>
          </div>
          <div class="form-group" *ngIf="!isLoadingCategory; else loadingTmpl">
            <label>Project Category</label>
            <div
              class="checkbox-group"
              [class.is-invalid]="f['categoriesFormArr'].invalid"
            >
              <div
                *ngFor="
                  let control of categoriesFormArr?.controls;
                  let i = index
                "
                class="checkbox"
              >
                <label
                  ><input type="checkbox" [formControl]="control" />
                  {{ categories[i]?.title }}
                </label>
              </div>
            </div>
            <div class="invalid-feedback" role="alert">
              At least one category must be selected.
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
</mat-dialog-content>
<mat-dialog-actions align="end"
  ><button mat-button mat-dialog-close>Cancel</button>
  <button
    type="submit"
    class="btn btn-primary"
    [disabled]="form.invalid"
    [routerLink]="['', newProject.projectName]"
    routerLinkActive="router-link-active"
  >
    Submit
  </button>
</mat-dialog-actions>

1 Ответ

0 голосов
/ 02 августа 2020

попробуйте поместить свою кнопку отправки в тег формы и удалите routerLink на этой кнопке, чтобы ваша отправка onSubmit называлась

...