要按名称对列表进行排序,您可以使用Angular 5和Firebase的以下解决方案:
npm install firebase @angular/fire
list.component.ts
的组件,并在其中添加以下代码:import { Component } from '@angular/core';
import { AngularFireDatabase } from '@angular/fire/database';
import { Observable } from 'rxjs';
@Component({
selector: 'app-list',
template: `
-
{{ item.name }}
`,
})
export class ListComponent {
items: Observable;
constructor(db: AngularFireDatabase) {
this.items = db.list('/items', ref => ref.orderByChild('name')).valueChanges();
}
}
ListComponent
添加到适当的模块中,并导入相关的Firebase和AngularFire模块。例如,在app.module.ts
中:import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AngularFireModule } from '@angular/fire';
import { AngularFireDatabaseModule } from '@angular/fire/database';
import { ListComponent } from './list.component';
const firebaseConfig = {
// 根据您的Firebase配置进行替换
};
@NgModule({
imports: [
BrowserModule,
AngularFireModule.initializeApp(firebaseConfig),
AngularFireDatabaseModule
],
declarations: [ListComponent],
bootstrap: [ListComponent]
})
export class AppModule { }
标签来显示列表组件。例如,在app.component.html
中:
现在,您的列表将按名称排序并显示在Angular应用程序中。
上一篇:按名称排序控件列表
下一篇:按名称排序MySQL列的脚本