Angular5 - 错误：使用无效数据调用函数 DocumentReference.set()。数据必须是一个对象，但它是：一个自定义的 PlatformModel 对象

Question

我在谷歌上找到了一些人们解决这个问题的帖子。但我无法在我的项目中重现解决方案。

我的界面：

declare module PlatformInterface {

    export interface Design {
        primaryColor: string;
        backgroundImage: string;
    }

    export interface Saga {
        id: string;
        name: string;
        short_desc: string;
        desc: string;
        manga: Manga[];
        anime: Anime[];
    }

    export interface Root {
        id: string;
        name: string;
        design: Design[];
        saga: Saga[];
    }

}

我的模特：

export class PlatformModel implements PlatformInterface.Root {
    id: string;
    name: string;
    design = [];
    saga = [];

    constructor(obj?: any) {
        this.id = obj.name.toLowerCase().replace(' ', '-');
        this.name = obj.name;
        this.design = obj.design;
        this.saga = obj.saga;
    }
}

我的服务：

@Injectable()
export class PlatformService {

    public list$: Observable<PlatformModel[]>;

    private _platform: AngularFirestoreCollection<PlatformModel>;

    constructor(db: AngularFirestore) {
        this._platform = db.collection<PlatformModel>('platforms');
        this.list$ = this._platform.valueChanges();
    }

    /** Get Platform by id */
    get(id: string): Observable<PlatformModel> {
        return this._platform.doc<PlatformModel>(id).valueChanges();
    }

    /** Add / Update Platform */
    set(id: string, platforms: PlatformModel) {
        return fromPromise(this._platform.doc(id).set(platforms));
    }

    /** Remove Platform */
    remove(id: string) {
        return fromPromise(this._platform.doc(id).delete());
    }

}

我在 Component.ts 中的函数

constructor(public _platformService: PlatformService) {
}

addPlatform(name: string) {
    if (name !== '') {
        const platform = new PlatformModel({
            name: name,
            design: [],
            saga: []
        });

        this._platformService.set(platform.id, platform).subscribe();
    }
}

Angular 编译器不会抛出任何错误，但是当我尝试触发 addPlatform 函数时，我在浏览器中出现此错误：

ERROR Error: Function DocumentReference.set() called with invalid data. Data must be an object, but it was: a custom PlatformModel object

错误说Data必须是一个对象，但它已经是一个对象了吗？我的意思是我在服务中定义它：

public list$: Observable<PlatformModel[]>;

[] 是否将其变为对象？

Answer 1

我在这里找到了一些澄清Firestore: Add Custom Object to db

虽然 firebase 可以将对象内的数据发送到数据库，但当数据返回时，它无法将其实例化回您的类的实例。因此不允许上课

我对自定义类的解决方法是

 this.db.collection(`${this.basePath}/`).doc(custom_class.$key)
.set(Object.assign({}, JSON.parse(JSON.stringify(custom_class))))
.then( ret => {
  log.debug('file added', ret);
}).catch( err => {
  log.error(err);
});

所以我猜你的情况是

    /** Add / Update Platform */
set(id: string, platforms: PlatformModel) {
    return fromPromise(this._platform.doc(id).set(Object.assign({},JSON.parse(JSON.stringify(platforms))));
}

Answer 2

要将地图添加到 Firestore 文档中，您必须使用：

Object.assign({}, JSON.parse(JSON.stringify(YOUR_MAP)))