Angular 应用程序中的 Firebase UI Auth 小部件答案

【问题标题】：Firebase UI Auth widget in Angular applicationAngular 应用程序中的 Firebase UI Auth 小部件
【发布时间】：2016-12-07 11:32:22
【问题描述】：

我只想在我的登录页面上包含 FirebaseUI 身份验证小部件（通过 ngRoute 控制）。

但是，顶层 JS 在所有其他页面上都会抛出这个错误：

“未捕获的错误：在页面上找不到 Firebase UI 小部件元素。”

虽然该错误在技术上是正确的，但令人讨厌的是，该小部件不应出现在所有页面上。

有没有人想出一种巧妙的方法来抑制这种情况？

谢谢，内德

【问题讨论】：

【解决方案1】：

您需要 Firebase 身份验证才能在所有需要身份验证的页面上工作，因此您需要为这些页面加载 Firebase Web SDK/Javascript。至于widget元素不存在，是不是widget不需要一组元素才能使用？

如果有，添加它们。如果没有，它们应该由 SDK 自动加载（就像它在常规 Web SDK 中加载 iFrame 的方式一样）。控制台告诉您缺少元素。

我知道，如果您托管 firebase 脚本而不是通过 CDN 加载它们，您将获得更丰富的错误处理/消息。你可以试试。

如果您想隐藏小部件元素，似乎 CSS 可以 display:none 您可能必须添加 !important 声明。

【讨论】：

谢谢。我在所有页面上都使用 Firebase Auth，这很好。我说的是 Firebase Auth UI（单独的脚本）。那是文字登录框（“单击此处使用 Facebook 登录”等）。那只想在一页上。我可以将它放在所有页面上，然后隐藏在除登录页面之外的所有页面上，但这很蹩脚。
投反对票，因为这实际上根本没有解决问题，实际上忽略了问题本身。