Firebase Angular2 -如何在没有太多开销的情况下查询和呈现列表
Firebase是一种由Google提供的云计算平台，它提供了一系列的后端服务和工具，用于开发高效、可扩展的应用程序。Angular2是一种流行的前端开发框架，用于构建现代化的Web应用程序。
在Firebase中，可以使用Firebase Realtime Database来存储和查询数据。下面是在没有太多开销的情况下查询和呈现列表的步骤：
- 首先，确保已经在Angular2项目中集成了Firebase。可以通过安装Firebase SDK并在项目中引入相关模块来实现。
- 在Firebase控制台中创建一个新的项目，并获取到项目的配置信息，包括项目ID、API密钥等。
- 在Angular2中创建一个服务（service），用于与Firebase进行交互。可以使用Firebase SDK提供的API来实现数据的读取和写入操作。
- 在服务中，使用Firebase Realtime Database的API来查询数据。可以使用
ref()方法获取对数据库的引用，并使用child()方法指定要查询的节点路径。 - 使用查询方法（如
once()或on()）来执行查询操作。once()方法用于执行一次性查询，而on()方法用于实时监听数据的变化。 - 在查询结果返回后，可以将数据呈现在Angular2的组件中。可以使用Angular2的数据绑定语法来将数据动态地显示在页面上。
- 如果需要对列表进行分页或过滤，可以使用Firebase提供的查询参数来实现。例如，可以使用
limitToFirst()和limitToLast()方法来限制返回的结果数量，使用orderByChild()方法来按照指定的子节点进行排序。 - 在呈现列表时，可以使用Angular2的循环指令（如
*ngFor）来遍历数据，并将每个项显示在页面上。
总结起来，使用Firebase和Angular2可以方便地查询和呈现列表数据。Firebase提供了强大的实时数据库和Angular2提供了灵活的前端开发框架，它们的结合可以帮助开发人员快速构建出高效、可扩展的应用程序。
腾讯云相关产品推荐：腾讯云数据库（https://cloud.tencent.com/product/cdb）、腾讯云云服务器（https://cloud.tencent.com/product/cvm）、腾讯云云函数（https://cloud.tencent.com/product/scf）等。
相关·内容
，因为每次有变化(即使是在一个帖子中)，整个列表都会被重新加载，从而重新呈现。因为我的应用程序中有喜欢和不喜欢的东西，所以这种情况会经常发生。基本上，如果我没记错的话，每次有人喜欢一个帖子，整个列表都会为每个用户重新加载。我知道有一种方法可以在监听firebase事件时维护列表的本地副本："child_added“、"child_removed”和"child_changed“。但是，如
浏览 16提问于2017-01-21得票数 4
回答已采纳
如何在不使用AngularFire的情况下获取对象列表我没有用天使火。我想用他们的Api提取数据，这是我要提取的配置文件列表：谢谢。
浏览 4提问于2015-11-27得票数 2
回答已采纳
我有一个网络应用程序，我可以添加‘列表’。每个列表都有时间限制。5、10和15分钟。React可以很好地呈现列表，但由于有时间限制，它会计算现在的时间和添加的时间(添加列表时)之间的差异。然而，目前有一个额外的nodejs后端可以更新数据库中的当前时间值，另外它还可以检查过期列表并将其删除。
问题是，如何在不使用外部nodejs后台的情况
浏览 0提问于2018-03-07得票数 0
有类似类型的问题，但没有一个问题解决了issue.Mainly我遵循的Angular2文档。我对Angular2完全陌生。我的问题是
如何在同一个页面中重用相同的angular2组件，通过传递不同的参数，比方说给组件取一个唯一的名称。示例:在两个不同的标签中创建两个相同类型的组件，如Component1和Component2
浏览 2提问于2018-05-07得票数 0
我想使用Entity Framework4，但不使用复杂的linq查询，只使用一些非常简单的查询，如get by id或xField = value，或插入和更新。你们认为这种情况下的性能会接近SqlCommand的性能吗？因为真的没有开销。
浏览 1提问于2012-06-08得票数 0
回答已采纳
我使用Google让用户搜索一个城市，然后基于addressType查询我的Firebase数据库。我的项目应该如何工作：I得到Google的对象，然后根据我搜索POI的信息(首先基于'locality‘)，如果没有返回结果(在firebase中找不到对象)，我执行相同的查询，但基于’adm_2‘，等等到目前为止我得到的是：，我能够获得Google的响应，然后执行基于&#
浏览 3提问于2016-10-14得票数 0
回答已采纳
4回答
我需要找到两个Comparable值中较小的一个：Comparable<C> b = ...;Stream.of(a, b).min(Comparator.naturalOrd
浏览 0提问于2018-07-10得票数 24
回答已采纳
我开始学习angular2，并开始使用ngrx/store (之前没有redux的经验)和firebase应用程序。现在，我无法思考如何在存储中存储基本的对象、数组和其他东西。这看起来很合适(组件可以只做store.select(“items”)，模板可以在上面订阅，对于突变，我仍然可以触发事件到商店，在那里我会用减法器对列表进行变异)，但我的猜测并不是因为这个列表可以从商店外部(其他订阅
浏览 1提问于2017-03-26得票数 3
回答已采纳
当结合使用Angular2 2.4.3和CSS3媒体查询特性时，可以这样做：
import {Component} from '
浏览 2提问于2017-01-20得票数 4
回答已采纳
在使用JPA/ORM (如Hibernate等人)时，通常会定义Java bean/POJO来表示映射到相应RDBMS表的实体。然而，我正在尝试开发的平台涉及支持200,000个这样的实体。如果我必须采用标准的Spring MVC + Hibernate模型，我可能最终会创建200K的model POJO、200K的DAO类和另外200K左右的JavaBeans，这些POJO包含的数据格式在视图中
浏览 0提问于2012-04-21得票数 1
我使用的是Angular2 CLI和Firebase。该应用程序托管在Firebase上，它使用Firebase实时数据库存储数据。并且在Angular2包中，所以它对所有人都是可见的。应用程序的用户不使用Firebase进行身份验证，但是他们生成和保存的数据必须是安全的，这样只有应用程序的apiKey等人才能访问数据。如何确保只有应用程序中<e
浏览 2提问于2017-03-14得票数 2
回答已采纳
Game = Backbone.Model.extend({ },});
向在场的人致以良好的问候和愉快的编码;)
浏览 2提问于2014-12-15得票数 2
回答已采纳
用一个例子来解释我的问题:我有一个列表视图，我需要在其中显示一个人的id和姓名。Ids存储在本地的SQLite中，我需要从Firebase获取相应的名称。在这种情况下，最好的方法是什么？如果If和名称都来自Firebase，那么Firebase UI将是答案，但是对于我的“查找”数据的用例来说，由于Firebase不能进行同步<
浏览 15提问于2018-02-09得票数 0
2回答
我有一个名为[HttpGet] GetCats()的web方法，它返回Cat对象的集合。
我添加了参数skip和take以允许分页。然而，需求已经增加，现在必须有可能进行复杂的过滤，在一个过滤器的集合的格式"PropertyName", "Value", "Type"例如。"CatName", "Mittens", "EqualTo"和排序过滤器<em
浏览 10提问于2017-04-11得票数 3
3回答
带有游戏服务器的实体框架
、、、
我一直在研究如何在我的C#游戏服务器中使用实体框架来简化查询。我非常喜欢类型安全，实体框架在自动化大部分样板代码方面做得很好。虽然我不太清楚如何使用一些组件，即ObjectContext。在没有详细介绍的情况下，每个查询都以以下方式工作：
允许查询类处理查询结果(无论如何，我真的不知道如<em
浏览 4提问于2009-07-28得票数 0
回答已采纳
1回答
在Firebase中，假设我有一个节点的DatabaseReference，它有10个子节点。有没有办法从DatabaseReference或任何查询中获取子列表。在android中，我如何在不使用侦听器事件的情况下简单地读取数据。
谢谢。
浏览 1提问于2016-05-28得票数 1
我正在使用一个识字代码工具来生成一个很好的项目源代码的HTML表示。我想使用Monaco来显示所有的代码，并提供智能功能，如“转到定义”，折叠等，但我需要包括内联识字代码注释。"Go to definition“和"Find all references”以内联方式显示其结果。是否可以显示包含自定义内容的类似窗格？我不想为每个代码块创建单独的(只读)编辑器，除非这可以在没有太多开销的情况下
浏览 0提问于2018-10-19得票数 0
例如，我想知道如何在弹性搜索中映射堆栈溢出中的问题和答案。您可以将答案作为问题的子类来实现，但在这种情况下，例如，呈现的列表如何提供您所给出的所有答案的概述？这样的列表包含问题的标题、答案的数量和你最后一次回答的日期。因此，它是问题数据和回答数据的混合体。
当在弹性搜索中使用父-子时，我只能从
浏览 2提问于2014-06-09得票数 0
回答已采纳
我在这个结构上有一个firebase数据库 DATA: { KEY: { AGE: "".
浏览 9提问于2020-11-20得票数 0
回答已采纳
人们说，在 cases中包含带有的date列，或者<=和>=可以提供索引日期列来显示基于该索引的数据(这意味着性能得到了改善)。然而，我发现两者对相同的结果都是一样的，而且显然没有考虑到性能。如果一切都是流线型的话，我们如何才能最大限度地减少查询时间。或者有什么更好的解决办法来解决这个问题？我在project_times.date和project_plans.month上都添加了索引查询1没有p
浏览 2提问于2021-01-26得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
