Блог

этот код внутри моего компонента регистрации

 export class RegisterComponent implements OnInit {
registrationForm : FormGroup
  isSubmitted: boolean = false
  cities:any = []
  countries:any = []
  genders = [{id:'MALE',name:'Male'},{id:'FEMALE',name:'Female'}]

  constructor(private formBuilder: FormBuilder,public authService: AuthService,
    private router: Router, private route: ActivatedRoute) {}


  ngOnInit(){
    this.initForm()
    this.allCountries()
  }


  allCountries(){
    this.authService.getCountries().subscribe(
      data => {
        // this.
        console.log("register data" , data);
        this.countries = data;

      }
      )
  }

  setCities(data) {

    console.log(data);
    let obj = this.countries.find(o => o.CountryGUID === data);
    this.cities = obj.cities

    console.log(obj)

  }

  
  initForm(){
    this.registrationForm = this.formBuilder.group({
      FirstName: ['', Validators.required],
      LastName: ['', Validators.required],
      LoginEMail: ['', Validators.required],
      MobileNumber: ['', Validators.required],
      Birthdate: ['', Validators.required],
      GenderLID: ['', Validators.required],
      CityGUID: ['', Validators.required],
      CountryGUID: ['', Validators.required],
    })

    }

    emailFormControl = new FormControl('', [
      Validators.required,
      Validators.email,
    ]);
    matcher = new MyErrorStateMatcher();



    onSubmit(){
      console.log("is submitted");
      
      console.log(this.registrationForm.value);
      this.isSubmitted = true;
      
      if(this.registrationForm.invalid){
        console.log('invalid');
        return;
      }

      this.authService.register(this.registrationForm.value).subscribe(
        data => {
          console.log("login data" , data);
        }
        )
        
      
        }
  }
  

Как я могу включить ту же форму регистрации во всплывающее окно внутри всплывающего компонента настройки учетной записи и просмотреть данные в компоненте настройки учетной записи вне всплывающего окна?

Я хочу, чтобы та же форма была внутри компонента настройки учетной записи, это выглядит так: раздел содержит значение отправленного регистра, выглядит как обычный текстовый компонент настройки учетной записи, а кнопка открытого всплывающего окна содержит форму, в которой вводятся значения данных внутри модального параметра edit-info, который открылся в компоненте настройки учетной записи

Вы можете указать селектор этого компонента регистрации, например, так:

Предположим, что имя вашего селектора компонента register app-register , поэтому в файле шаблона компонента, где вы хотите отобразить ту же форму register, вы должны добавить этот селектор. Пример:

 <app-register></app-register>
  

Это загрузит компонент register в ваш другой компонент.