代码之家 › 专栏 › 技术社区 › scg gerard

角度2未定义获取外部亚族[重复]

subscribe undefined angular

scg gerard · 技术社区 · 7 年前

大家晚上好。

这是代码。

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),
                )
  }

    }

请等待你的回答。。。

2 回复 | 直到 7 年前

JayDeeEss 7 年前

由于这是一个异步调用,因此在ngOnInit()中调用后不会立即得到结果。在订阅调用中放入控制台语句,然后您将看到候选项

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

使现代化

<div>{{candidates}}<div>

或者如果是json

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

Aniruddha Das xing 7 年前

您的代码运行良好,这是可观察类型变量的正常行为。

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.
}

所以你的控制台。日志未定义。处理可观察值内的值总是一个很好的建议。

ngOnInit() {

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

observable<any> 变量