所以我有一个购物车组件可以让客户结账。我正在使用Angular CLI - Stripe Checkout - Firebase Firestore。
我在这一行收到错误:this.paymentSvc.processPaymentFS(this.key, dataObj);
在我的组件ngOnInit
内
some-app.component.ts
的代码
import { Component, OnInit } from '@angular/core';
import { AuthService } from '../services/auth.service';
import { Observable } from 'rxjs/Observable';
import { environment } from '../../environments/environment';
import { PaymentModule } from './customer-cart.module';
import { PaymentService } from '../services/payment.service';
import { Order } from '../models/order';
import { User } from '../models/user';
@Component({
selector: 'app-some-app',
templateUrl: './some-app.component.html',
styleUrls: ['./some-app.component.css'],
})
export class SomeAppComponent implements OnInit {
quantity = 3;
fee = 40;
amount = 500;
totalAmount: number = this.fee + this.amount; // 500 == 5.00
handler: any;
public order: Observable<Order>;
key: string;
currentUser: User;
loggedIn:boolean;
angForm: FormGroup;
constructor(private paymentSvc: PaymentService, private authService: AuthService) {
}
ngOnInit() {
this.authService.getCurrentUser().subscribe(user => {
this.currentUser = user;
this.key = this.currentUser.$key;
})
this.handler = StripeCheckout.configure({
opened: function() {
console.log('payment form opened');
},
closed: function() {
console.log('payment form closed');
const dataObj = {
quantity: this.quantity,
amount: this.totalAmount * 100,
date: Date.now(),
status: 'active' // history
};
console.log("data obj ok");
this.paymentSvc.processPaymentFS(this.key, dataObj);
console.log('payment successful');
}
});
}
handlePayment() {
this.handler.open({
name: 'Some App',
description: 'Checkout out the items in your cart',
amount: this.totalAmount * 100
});
}
我尝试访问的服务功能代码(payment.service.ts
):
import { Injectable } from '@angular/core';
import { AngularFireAuth } from 'angularfire2/auth';
import { AngularFirestore, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Observable } from 'rxjs/Observable';
import { Order } from '../models/order';
@Injectable()
export class PaymentService {
userId: string;
private orderDoc: AngularFirestoreDocument<Order>;
order: Observable<Order>
constructor(private afAuth: AngularFireAuth, private afS: AngularFirestore) {
this.afAuth.authState.subscribe((auth) => {
if (auth) this.userId = auth.uid
});
}
processPaymentFS(id, data) {
console.log('in process payment --payment service')
this.orderDoc = this.afS.doc<Order>('orders/'+id)
console.log('doc path ok --payment service')
this.orderDoc.set(data)
console.log('order doc set --payment service')
}
}
最后,这是模型(order.ts
):
export class Order {
$key: string;
quantity: number;
amount: number;
date: string;
status: string;
}
其他重要提示:PaymentService
app.module.ts
我必须编辑一些东西,所以如果我删除了应该在这里的任何内容,请告诉我。我会检查我的代码是否在那里并更新。