Question

我已经将Angular2项目直接与Firebase连接。我的数据库结构如下图所示。所以我们有几个对象。

主要是订单，然后是关键零订单，一些额外信息和另一个对象“项目”，其中包含几个对象，如0,1等。每个对象都有一个名为“product”的对象，其中包含一些其他参数......

orders
    -> datePlaced,
            items
                -> 0
                    -> quantity, totalPrice, product
                                                  ->
                                                     imageUrl,
                                                        price,
                                                        title

我的观点是，当我创建“我的订单”标签时，我希望按特定顺序获取每个项目的信息，例如我看到订单列表和小按钮“查看订单”，我点击，我看到有关此订单的详细信息，使用特殊密钥。

我用命令，按钮准备了视图，但我不能从对象命令中获取任何对象，我有一个空白页面。

阶details.component.ts

    export class OrderDetailsComponent implements OnInit, OnDestroy {

order$;
userId: string;
userSubscription: Subscription;

constructor(private orderService: OrderService, private authService: AuthService) {}

async ngOnInit() {
    this.userSubscription = this.authService.user$.subscribe(user => this.userId = user.uid);
    this.order$ = this.authService.user$.switchMap(u => this.orderService.getOrdersByUser(u.uid));
}

ngOnDestroy() {
    this.userSubscription.unsubscribe();
}

}

阶details.component.html

<div class="card" *ngIf="order$ | async as order">
<div class="card-body">
    <h5 class="card-title">Your Order</h5>
    <p class="card-text">You ordered {{ order.datePlaced | date }} items</p>
    <ul class="list-group list-group-flush">
    <li *ngFor="let order of order.shipping" class="list-group-item">
        {{ order.city }} x {{ order.city }}
        <div class="float-right">
        {{ order.totalPrice | currency:'USD':'symbol' }}
        </div>
    </li>
    <li class="list-group-item font-weight-bold">
        Total
        <div class="float-right">
        {{ order.totalPrice | currency:'USD':'symbol' }}
        </div>
    </li>
    </ul>
</div>
</div>

order.service.ts

export class OrderService {

constructor(private db: AngularFireDatabase, private shoppingCartService: ShoppingCartService) { }

async placeOrder(order) {
    let result = await this.db.list('/orders').push(order);
    this.shoppingCartService.clearCart();
    return result;
}

getOrders() { 
    return this.db.list('/orders');
}

getOrdersByUser(userId: string) {
    return this.db.list('/orders', {
    query: {
        orderByChild: 'userId',
        equalTo: userId        
    }
    });
}
}

如何从复杂对象“订单”中获取每个参数？

Answer 1

我通过在order-details.component.ts中使用param路由然后在订单服务中使用create function getOrder（id）解决了这个问题。当您拥有订单的ID时，从数据库中获取对象非常简单。

进入包含另一个对象的Firebase复杂对象

1 个答案: