Угловой 6 реактивный контроль формы - PullRequest
0 голосов
/ 06 июля 2018

Я хочу сделать небольшую домашнюю страницу с угловым значением 6. Одной из ее частей являются некоторые тесты, такие как первичная факторизация и тест на високосные годы. Я сделал это с помощью реактивных форм для проверки. Моя проблема в том, что я не могу выполнить обе функции.

HTML:

<div class="container">
  <form [formGroup]="primForm" (ngSubmit)="onSubmit(primForm.value)" novalidate>
    <div class="form-group">
      <h3>Primfaktoren</h3>
      <label>Name:
        <input class="form-control" formControlName="zahl" placeholder="42" #spy>
      </label>
      <button type="submit" [disabled]="primForm.pristine || primForm.invalid" class="btn btn-success">Zerlegen</button>    
      <br>
      <div>Die Faktoren sind:</div>
      <br>
      <div style="display:inline" *ngFor="let faktor of faktoren">{{faktor}}</div>
      <br>
    </div>
    <p>{{spy.className}}</p>
  </form>

  <form [formGroup]="jahrForm" (ngSubmit)="onSubmit(jahrForm.value)" novalidate>
    <div class="form-group">
      <h3>Schaltjahrtest</h3>
      <label>Jahr:
        <input class="form-control" formControlName="jahr" placeholder="2018" #spy1>
      </label>
      <button type="submit" [disabled]="jahrForm.pristine || jahrForm.invalid" class="btn btn-success">Prüfen</button>
      <p>{{jahr}} ist {{prf}} Schaltjahr</p>
    </div>
    <p>{{spy1.className}}</p>
  </form>
</div>

Машинопись:

constructor(private fb: FormBuilder) {
    this.createForm();
}

  createForm() {
    this.primForm = this.fb.group({
      zahl: ['', Validators.min(3)]
    });
    this.jahrForm = this.fb.group({
      jahr: ['', Validators.min(1)]
    });
  }

  onSubmit(object: Object) {
    console.log(object, typeof object);

    this.submitted = true;

    if (this.primForm.dirty) {
      this.help = parseInt(object['zahl'], 10);
      this.ergebnis = this.primFaktor(this.help);
    } else {
      if (this.jahrForm.dirty) {
        this.help = parseInt(object['jahr'], 10);
        this.prf = this.jahrTest(this.help);
      }
    }
  }

  primFaktor(zahl: number): number[] {

    this.faktoren = [];
    let index = 2;

    while (zahl !== 1) {
      if (zahl % index === 0) {
        this.faktoren.push(index);
        zahl /= index;
        index = 2;
      } else {
        index++;
      }
    }
    return this.faktoren;
  }

  jahrTest(jahr: number): string {
    this.antwort = '';

    if (jahr % 4 === 0 && (jahr % 100 !== 0 || jahr % 400 === 0)) {
      this.antwort = 'ein';
    } else {
      this.antwort = 'kein';
    }
    return this.antwort;
  }
}

Я могу использовать функцию prim, но если я буду использовать тест года, ничего не произойдет, и страница вылетит.

Я ничего не нашел в сети.

Может быть, у кого-то есть идея или обходной путь.

Спасибо.

1 Ответ

0 голосов
/ 08 июля 2018

Я решил проблему. Изменена машинопись с:

onSubmit(object: Object) {
    console.log(object, typeof object);

    this.submitted = true;

    if (this.primForm.dirty) {
      this.help = parseInt(object['zahl'], 10);
      this.ergebnis = this.primFaktor(this.help);
    } else {
      if (this.jahrForm.dirty) {
        this.help = parseInt(object['jahr'], 10);
        this.prf = this.jahrTest(this.help);
      }
    }
  }

Кому:

const key = Object.keys(object);

    this.submitted = true;

    if (key[0] === 'zahl') {
      this.help = parseInt(object['zahl'], 10);
      this.ergebnis = this.primFaktor(this.help);
  } else {
      if (key[0] === 'jahr') {
       this.help = parseInt(object['jahr'], 10);
        this.prf = this.jahrTest(this.help);
     }
    }
  }

Теперь я получаю ключ от объекта, и функции проверяют значение ключа.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...