Почему мои радио-кнопки проверяются автоматически? Как я могу отправить только один по умолчанию в Angular 9? - PullRequest
0 голосов
/ 16 февраля 2020

Проблема, с которой я столкнулся сейчас, заключается в том, что у меня есть два radio-button с, и мне нужно, чтобы при нажатии радиокнопки admin вы могли видеть одну форму и при нажатии * 1005. * Радиокнопка, вы можете увидеть другую форму. До сих пор оба проверены, и я не знаю, почему, только один должен быть проверен по умолчанию, и что он будет показывать одну форму за один раз

  • Ниже я буду публиковать код рада ios и изображение их. Я использую angular-material.

Радиокнопки html

<mat-radio-group aria-label="Select an option" class="center">
    <mat-radio-button  (click)="radio_btn=true" >Admin</mat-radio-button>
    <mat-radio-button (click)="radio_btn=false">User</mat-radio-button>
  </mat-radio-group>
  <div class="ng-container ">
        <div class="row justify-content-center" *ngIf="radio_btn==true">
        <form class="example-form " [formGroup]="signupForm" (ngSubmit)="send(signupForm)">
          <mat-form-field class="example-full-width">
            <input matInput formControlName="email" placeholder="User" type="email">
          </mat-form-field><br>
          <div *ngIf="signupForm.get('email').hasError('email') && signupForm.get('email').touched">Introduce an email</div><br>
          <mat-form-field class="example-full-width">
            <input matInput formControlName="password" placeholder="Password" type="password">
          </mat-form-field><br>
          <div *ngIf="signupForm.get('password').hasError('password') && signupForm.get('password').touched">Introduce the correctly password</div><br>
          <button mat-raised-button [disabled]="signupForm.invalid" class="colour_button " type="submit">Register</button>
        </form>
    </div>
</div>

TS файл радиостанции

export class HomeComponent implements OnInit {
  radio_btn:boolean = true;
  ngOnInit(): void {
  }
}

Вот как они выглядят

enter image description here

1 Ответ

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

Поместите это в свою группу радиостанций:

<mat-radio-group [(ngModel)]="radio_btn”

Затем имейте

<mat-radio-button [value]=“true“

И

    <mat-radio-button [value]=“false”

Также удалите обработчики (щелчка) из радио кнопки.

Для изменения значения radio_btn.

См. Пример радиомодуля материала html.

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