Angular 角度2未定义获取外部亚族

大家晚上好

我在从我通过subcribe订阅的服务中检索数据时遇到问题；我在subscribe函数内部获取数据，但在它外部未定义

这是代码

userservice.ts

import { Injectable } from "@angular/core";
import { Http, Response, Headers } from "@angular/http";
import 'rxjs/Rx';
import { Observable } from "rxjs";

@Injectable()
export class UserService{
  constructor(private http: Http){

  }

getRegistrations(): Observable<any> {
    return this.http.get('http://127.0.0.1:8000/api/candidatesL')
      .map(
        (response: Response) => {
          return response.json().candidates;
        }
      );
  }

  }

import { Component, OnInit } from '@angular/core';
import { NgForm } from "@angular/forms";
import { Candidate } from "../candidate.interface";
import { Response } from "@angular/http";
import { UserService } from "../user.service";

@Component({
  selector: 'app-all-registration',
  templateUrl: './all-registration.component.html',
  styleUrls: ['./all-registration.component.css']
})
export class AllRegistrationComponent implements OnInit {

  candidates: Candidate[];

  constructor(private userService: UserService) {}

  ngOnInit() {

                this.getRegistration()
                console.log(this.candidates);
             }


    getRegistration(){
    this.userService.getRegistrations()
      .subscribe(
                  (candidates: Candidate[]) => this.candidates = candidates,
                  (error: Response) =>  console.log(error),
                )
  }

    }

当我在.subscribe（…）中时，我可以显示数据，但在外部我无法定义

---

请让我等待你的回答

由于这是一个异步调用，因此在ngOnInit（）中调用后不会立即得到结果。在subscribe调用中放入console语句，然后您将看到候选项

    getRegistration(){
        this.userService.getRegistrations()
          .subscribe(
                      (candidates: Candidate[]) => {
            this.candidates = candidates
            console.log(this.candidates);
             },
                      (error: Response) =>  console.log(error),
                    )
      }

更新 您已经将候选对象定义为类的属性，因此可以在html中显示其值，如：

<div>{{candidates}}<div>

{{candidates}

或者如果它是json

<div *ngIf="candidates">{{candidates | json}}<div>

{{候选者| json}

---

一旦在subscribe中分配了值，它将显示任何值。如果您希望选中以仅在值有值时（订阅完成后）显示该值，则始终可以在html元素上放置一个*ngIf指令来检查该值。

由于它是一个异步调用，因此在ngOnInit（）中调用后不会立即得到结果。在subscribe调用中放入console语句，然后您将看到候选项

    getRegistration(){
        this.userService.getRegistrations()
          .subscribe(
                      (candidates: Candidate[]) => {
            this.candidates = candidates
            console.log(this.candidates);
             },
                      (error: Response) =>  console.log(error),
                    )
      }

更新 您已经将候选对象定义为类的属性，因此可以在html中显示其值，如：

<div>{{candidates}}<div>

{{candidates}

或者如果它是json

<div *ngIf="candidates">{{candidates | json}}<div>

{{候选者| json}

---

一旦在subscribe中分配了值，它将显示任何值。如果您希望检查以仅在值有值时（订阅完成后）显示该值，则始终可以在html元素上放置一个*ngIf指令来检查该值。

您的代码工作正常，这是Observable type变量的正常行为

ngOnInit() {

  this.getRegistration()  // this will set the value of this.candidates in future as its async.
  console.log(this.candidates); // this line will executed immediately before the observable returns a value.
}

因此，您的console.log提供了未定义的。处理可观测值内部的值总是一个好建议

ngOnInit() {

  this.userService.getRegistrations().subscribe((candidates: Candidate[]) => {
      this.candidates = candidates;
      console.log(this.candidates);
    },
        (error: Response) =>  console.log(error)
    );
}

---

当您的服务返回一个可观察的对象时，只有订阅它才能从中提取一个值。请记住，它不是直接变量，而是一个可观察的变量。

您的代码工作得非常好，这是可观察类型变量的正常行为

ngOnInit() {

  this.getRegistration()  // this will set the value of this.candidates in future as its async.
  console.log(this.candidates); // this line will executed immediately before the observable returns a value.
}

因此，您的console.log提供了未定义的。处理可观测值内部的值总是一个好建议

ngOnInit() {

  this.userService.getRegistrations().subscribe((candidates: Candidate[]) => {
      this.candidates = candidates;
      console.log(this.candidates);
    },
        (error: Response) =>  console.log(error)
    );
}

---

当您的服务返回一个可观察的对象时，只有订阅它才能从中提取一个值。记住，它不是直接变量，而是一个可观察的变量。

这个问题可能被问100次这个问题可能被问100次是的，但我想使用子脚本之外的候选数据来显示。怎么做？因为外部订阅总是没有定义？谢谢，现在我明白了，如果有帮助，你可以接受答案！是的，当然……是的，但是我想使用子脚本之外的候选数据来显示。怎么做？因为外部订阅总是没有定义？谢谢，现在我明白了，如果有帮助，你可以接受答案！是的，当然。。。

ngOnInit() {

  this.getRegistration()  // this will set the value of this.candidates in future as its async.
  console.log(this.candidates); // this line will executed immediately before the observable returns a value.
}