代码之家 › 专栏 › 技术社区 › Qusay Saad

如何查找已完成项目的总长度?

angular5 angularfire2 firebase-realtime-database firebase angular

Qusay Saad · 技术社区 · 7 年前

如何查找已完成项目的总长度?

如何查找已完成的项目总数(TODO)?在项目列表中如何在数组中查找某个对象的长度

<div>Todo List:</div> {{(items | async)?.length}}  <-- Total Items in list

<div>{{(items.completed | async)?.length}}</div> <!-- Total completed items? - length of total completed items

<hr>

<ul *ngIf="todo_all">
    <li *ngFor="let item of items | async"  [class.completed]="item.completed">
        {{item.description}}
    </li>
</ul>


itemsRef: AngularFireList;
items: Observable<Todo[]>;

constructor(db: AngularFireDatabase) {
this.itemsRef = db.list('todos')
// Use snapshotChanges().map() to store the key
this.items = this.itemsRef.snapshotChanges().map(changes => {
return changes.map(c => ({ key: c.payload.key, ...c.payload.val() }));
});
}

1 回复 | 直到 7 年前

Tsortanidis Christos 7 年前

实际上,您可以从现有的可观察对象中筛选客户端上的项目,或者进行简单的查询以获取已完成的项目。

completedItemsCount: Observable<number>;

单向:

this.completedItemsCount = items
.map(items => 
    items.filter(item => item.completed).length
); // Maps the observable, filters the completed and return its length

另一种方式:

this.completedItemsCount = db
.list('/todos', ref => ref.orderByChild('completed').equalTo(true))
.map(changes => {
    return changes.map(c => (
        { 
            key: c.payload.key,
            ...c.payload.val(),
        }
    )).length; // Eventually return the length
});

当然,如果您可以将计数器保留在数据库中的某个位置,这样您就不必只为一个数字而首先获取整个列表,这总是更好的,但这可能会非常有效,除非您的待办事项列表非常大。如果是的话,第一次出现这个数字要花很多时间。我希望这有帮助。

推荐文章

Vimal · 用于用户名验证的JavaScript正则表达式

6 年前

user2024080 · 我如何防止我的表单在以后编辑?

6 年前

DiPix · 如何在Visual Studio中将Angular 5应用程序添加到解决方案中?

6 年前

Karl Johan Vallner · 如何将datatable寻呼机模板添加到Angular ngx datatable

6 年前

Ali Bedaer · 具有多个组件的角形5

6 年前

user8707389 · Angular 5侦听器或用于按钮禁用属性更改的指令

6 年前

3gwebtrain · 如何单独更新'BehaviorSubject'单个值

6 年前

Neto · 角度5-使用RouterUseStrategy时如何重新加载当前数据

6 年前

Lakshan Thilakarathne · Firebase 5 Angular 5 AngularFireList。snapshotChanges()错误

6 年前

Robby · 角度5构建生成main。以MB为单位进行捆绑,这会在生产中造成性能问题

6 年前