为什么firebase实时数据库的响应不能反映到angularjs中的html答案

【问题标题】：Why response of firebase realtime database not reflect to html in angularjs为什么firebase实时数据库的响应不能反映到angularjs中的html
【发布时间】：2018-04-26 05:22:43
【问题描述】：

我正在尝试使用 AngularJS 显示 Firebase 实时数据库对 HTML 页面的响应，如下所示 {{ pps }}。

Controller.js

firebase.database().ref('/activeUsers/9791009080').once('value').then(function(snapshot) {
    $scope.pps = (snapshot.val() && snapshot.val().msisdn) || 'Anonymous';
    console.log($scope.pps);
});

index.html

<h1>{{ pps }}</h1>

问题是当我在console.log 中找到值时，前端 HTML 值没有反映，请告诉我上面的代码我错过了什么。

【问题讨论】：

标签： angularjs firebase firebase-realtime-database

【解决方案1】：

使用 $scope.$apply 告诉 Angular 所做的更改。

firebase.database().ref('/activeUsers/9791009080').once('value').then(function(snapshot) {
  $scope.$apply(() => {
    $scope.pps = (snapshot.val() && snapshot.val().msisdn) || 'Anonymous';
    console.log($scope.pps);
  });
});

【讨论】：

【解决方案2】：

如果您不熟悉使用 Angular 1 + Firebase，我建议您尝试 AngularFire。它比您的普通角度方法更好地集成。

在这里查看。

https://github.com/firebase/angularfire/blob/master/docs/quickstart.md

和平。

【讨论】：

【解决方案3】：

您可以尝试以下解决方案。

firebase.database().ref('/activeUsers/9791009080').once('value').then(function(snapshot) {
    $timeout(function() {
        $scope.pps = (snapshot.val() && snapshot.val().msisdn) || 'Anonymous';
    });
});

现在，为什么会这样？
实际上，该事件将在$apply 范围内发生，因此需要告诉 Angular 有一些事件要处理。您可以通过$timeout 执行此操作，也可以尝试$apply 范围。

在这里，我使用$timeout，因为它不会引发错误，即使它会在来自 firebase 的事件发生时保持流程。

【讨论】：