javascript - 如何在 ionic 中显示 Javascript 文件中的数据？

Question

我是 Javascript 和 Ionic 新手，我想知道如何在应用程序本身中显示我的用户的名称。

1. 我与 Firebase 的连接运行良好

2. 这是js文件的代码:

   var userId = '-KcntxrTC1eZjrkyycn4';
   return firebase.database().ref('/accounts/' + userId).once('value').then(function(snapshot) {
       var displayName = snapshot.val().name;
       console.log(displayName);
       // ...
   });
   

3. 我的 html 文件由该代码所在的 Controller 控制。

4. 控制台日志呈现“Sebastien”，因此它可以工作

5. 当我在 html 文档中写入 {{displayName}} 时，什么也没有显示。

我错过了什么？

编辑 - 添加代码

这是我的 Controller 的代码:

.controller('accountController',['$scope', '$firebaseArray', 'CONFIG', '$document', '$state', function($scope, $firebaseArray, CONFIG, $document, $state) {

  var userId = '-KcntxrTC1eZjrkyycn4';
  return firebase.database().ref('/accounts/' + userId).once('value').then(function(snapshot) {
  var displayName = snapshot.val().name;
  $scope.displayName = snapshot.val().name;
  console.log(displayName);
  // ...


  });
}])

这是我的 HTML 文档的代码:

<!-- *profile-name / name profile -->
                <h3 class="profile-name">{{diplayName}}</h3>

问题是，我一登录就可以在控制台中显示该名称，但是当我访问由实际 Controller 控制的页面时，它不会显示该名称。就像它不明白必须从 Firebase 获取数据一样。

Answer 1

无论你想在 View 中显示什么，你都需要在$scope Angular Service中添加

JavaScript

$scope.data = {
  fName: "Sanjay",
  lName: "Nishad"
}

HTML

<p> {{data.fName}} </p>
<p> {{data.lName}} </p>

就你的情况而言:您不需要声明 var displayName = snapshot.val().name; 只需添加 $scope

$scope.displayName = snapshot.val().name;

或

$scope.displayData = snapshot.val();