Question

getSpecificData(par) {
return this.afd.list('products/products', ref => ref.orderByChild('par').equalTo(par)).valueChanges();
}

在我的组件中，我有这个：

export class Product {
  name: string;
  price: string;
  quantity: string;
}

ionViewDidLoad() {
    let aux =this.readData();
    console.log('Products', aux);
}
readData() {
    return this.firebaseService.getSpecificData(this.par).subscribe(
        items => {
            this.data = items,
            console.log('Data from Firebase ', this.data)
        }
    );
}

“console.log（'来自Firebase的数据'，this.data）”正在打印数据，但是“console.log（'Products'，aux）;”让我不确定。

我做错了什么？

我的目标是迭代数据数组并将每个项目转换为产品类型的对象。

此致

Answer 1

您的readData方法不会返回实际记录。一切都是异步发生的，这就是它在subscribe处理程序中工作的原因（只有在异步任务完成时才调用该位。

快速时间表示例：

ionViewDidLoad()
let aux = this.readData();
readData()
return this.firebaseService.getSpecificData(this.par).subscribe(
);
console.log('Products', aux);（太快!!!）
（调用firebase getSpecificData完成）
items => {
this.data = items,这是this.data收到项目
console.log('Data from Firebase ', this.data)
}

Answer 2

芬顿的解释是正确的。

我找出了解决方案。不知道是否是最好的解决方案，但它工作正常。

在我的提供商中，我有以下代码：

    export class Product {
    name: string;
    price: string;
    quantity: string;
    constructor(name: string, price: string, quantity: string) {
        this.name = name;
        this.price = name;
        this.quantity = quantity;
    }
}


    getSpecificData(par) {
    return this.afd.list('products/products', ref => ref.orderByChild('par').equalTo(par)).valueChanges().map(items => {
        let results = items.map(item => {
            return new Product(
                item.name,
                item.price,
                item.quantity
            );
        })
        return results;
    });
}

我的组件是这样的：

readData() {
    this.firebaseService.getSpecificData(this.stock).map(
        data => {
            this.products = data;
        }
    ).subscribe();
}

工作正常。我在我的html文件中读取结果。

<ion-col *ngFor=" let product of products" >
        {{product.name}}
</ion-col>

将json内容转换为对象

2 个答案: