首页 文章

Angular 2,在ngOnInit中订阅后无法获取数据

提问于
浏览
0

我有一个问题,也许我不明白该怎么做但是当我尝试在角度ngOnInit期间从HttpRequest捕获数据时,我的console.log返回一个“未定义”值 . 问题是,当我在模板视图中使用此值时,它可以工作!

这是我的组件

export class ReferentielFormComponent implements OnInit {
  id: number;
  currentUser;
  referentiel;
  progressValue: number;
  formGroup: FormGroup;
  isNew: boolean;

  constructor(private service: AppService,
          private referentiels: ReferentielService,
          private router: ActivatedRoute,
          private config: NgbTabsetConfig) {
  }

  ngOnInit() {
    this.router.params.subscribe((params: Params) => this.id = params['id']);
    if (this.id) {
      this.referentiels.getReferentiel(this.id).subscribe(data => this.referentiel = data);
    } else {
      this.referentiel = {};
    }
    this.isNew = !this.referentiel;

    console.log(this.referentiel);
    console.log(this.isNew);
    this.progressValue = 20;

    this.formGroup = new FormGroup({
      titre: new FormControl(!this.isNew ? this.referentiel.titre : '', [
        Validators.required,
      ]),
      description: new FormControl(!this.isNew ? this.referentiel.description : '', [
        Validators.required,
      ])
    });
  }
}

变量this.referentiel给我一个未定义的,所以我无法绑定我的Form和现有的值因为...

有什么建议 ?

3 回答

  • 2

    试试这个:

    ngOnInit() {
            this.router.params.subscribe((params: Params) => this.id = params['id']
            if (this.id) {
              this.referentiels.getReferentiel(this.id).subscribe(data => this.referentiel = data);
            } else {
              this.referentiel = {};
            }
            this.isNew = !this.referentiel;
    
            console.log(this.referentiel);
            console.log(this.isNew);
            this.progressValue = 20;
    
            this.formGroup = new FormGroup({
              titre: new FormControl(!this.isNew ? this.referentiel.titre : '', [
                Validators.required,
              ]),
              description: new FormControl(!this.isNew ? this.referentiel.description : '', [
                Validators.required,
              ])
            });
            );
          }
    

    this.is尚未在订阅之外定义 .

  • 1

    试试这样:

    Type 1 :

    ngOnInit() {
        this.router.params.subscribe((params: Params) => {
            this.load(params['id']);
        });
    }
    
    load(id) {
        this.id = id;
        console.log('this.id', this.id);
    }
    

    Type 2 :

    ngOnInit() {
        this.router.params.subscribe((params: Params) => {
            this.id = params['id'];
        }, () => {
            console.log('this.id', this.id);
        });
    }
    
  • 0
    this.referentiel is undefined till the subscribe completes. I think you have to move the formbuilder code to subscribe.
    
    
    
    
      ngOnInit() {
            this.router.params.subscribe((params: Params) => this.id = params['id']);
            if (this.id) {
                this.referentiels.getReferentiel(this.id).subscribe(data => {
                        this.referentiel = data;
                        this.buildForm(););
                }
                else {
                    this.buildForm();
                    this.referentiel = {};
                }
            }
            //Build form function
            buildForm() {
                this.isNew = !this.referentiel;
                this.formGroup = new FormGroup({
                    titre: new FormControl(!this.isNew ? this.referentiel.titre : '', [
                        Validators.required,
                    ]),
                    description: new FormControl(!this.isNew ? this.referentiel.description : '', [
                        Validators.required,
                    ])
                });
            }
    

相关问题