Question

我正在创建一个CMS应用程序，仅用于测试目的，我使用Google Firebase的登录按钮获取数据。我正在使用rxjs正确返回JSON，但它返回一个带有某种令牌的奇怪对象。请帮助我获得没有该令牌的对象。

ajax.service.ts

import { Injectable } from '@angular/core';
import { Headers, Http, Response } from '@angular/http';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class AjaxService {

  constructor(private http: Http) { }

  saveData(data: any) {
    const header = new Headers({'Content-type': 'application/json'});
    return this.http.post('https://cms-app-dev.firebaseio.com/data.json', data, {headers: header});
  }

  getData() {
    return this.http.get('https://cms-app-dev.firebaseio.com/data.json')
        .pipe(map(
                (response: Response) => {
                    return response.json();
                }
            ));
  }
}

login.component.ts

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { AjaxService } from '../ajax.service';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
    loginForm: FormGroup;
    submitted: boolean = false;

  constructor(private ajaxService: AjaxService) { }

  ngOnInit() {
    this.loginForm = new FormGroup({
        'email': new FormControl(null, [Validators.required, Validators.email]),
        'password': new FormControl(null, Validators.required)
    });
  }

  onSubmit() {
    this.ajaxService.getData().subscribe(
          (res: any) => {console.log(res);},
          (error) => {console.log(error);}
      );
  }

}

Answer 1

let data=[];

onSubmit() {
        this.ajaxService.getData().subscribe(
              (res: any) => {
                     for(let object in res) {
                          data.push(object.email) }
             },
              (error) => {console.log(error);}
          );
}

由于您要向firebase发布数据，因此它会将每个对象存储在唯一令牌下。因此，它本身就是一个必须迭代的对象。因此，您无法在组件模板中使用常规循环。因此，在ts文件中使用for循环并以数组形式存储它，您将能够遍历模板中存储的数据。希望有助于!!祝好运。

Angular RxJS没有从Firebase正确返回json

1 个答案: