以下是一个使用Angular和Firebase将集合插入常量的示例代码:
npm install firebase @angular/fire
app.module.ts
文件中添加以下代码:import { NgModule } from '@angular/core';
import { AngularFireModule } from '@angular/fire';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { environment } from '../environments/environment';
@NgModule({
imports: [
AngularFireModule.initializeApp(environment.firebaseConfig),
AngularFirestoreModule
],
...
})
export class AppModule { }
AngularFirestore
和Observable
:import { Component } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { Observable } from 'rxjs';
@Component({
...
})
export class MyComponent {
items: Observable;
constructor(private firestore: AngularFirestore) {
this.items = this.firestore.collection('myCollection').valueChanges();
}
}
-
{{ item.property }}
在上面的示例中,我们创建了一个名为MyComponent
的组件,它在构造函数中使用AngularFirestore
服务从名为myCollection
的Firebase集合中检索数据。然后,我们在模板中使用*ngFor
指令遍历items
数组,并显示每个项目的property
属性的值。
请注意,上述示例中的environment.firebaseConfig
是一个环境变量,用于存储Firebase的配置信息。您需要在environment.ts
文件中定义并导出该变量,以便在应用程序中使用。