Angular js，调用函数从 Angular FireStore 中的数据中获取字符串数组答案

【问题标题】：Angular js , calling function to get string array from data in angular FireStoreAngular js，调用函数从 Angular FireStore 中的数据中获取字符串数组
【发布时间】：2019-06-02 07:48:43
【问题描述】：

我是 Angular 的新手，正在尝试使用以下函数从 Firebase 获取详细信息作为字符串数组：

Firestore：公司 > 详细信息 > 应用 > 名称：“WM,TT,MP”

getCompanies(): string [] {
var appl: string []  = [] ;

this.db.database.ref("companies/details/app/").on('value', function (snap) {

  snap.val().name.split(",").forEach(function(x:string){
    appl.push(x);
    console.log(">>>first "+appl.length);
  });

  });

  console.log("Reached here ");
  console.log(">>>second "+appl.length);
  return appl;
}

当我在初始化时从组件调用 getCompanies 时，例如

 ngOnInit() {

    console.log(">>>"+this.localservice.getCompanies().length);


  }

它运行没有任何错误，但我得到以下输出，但我没有得到字符串 []。长度变空了。

Reached here 
>>>second 0
>>>0
>>>first 1
>>>first 2
>>>first 3

所以问题是，第二步在第一步之前被执行。结果，我将字符串 [] 设为空白，如何以角度进行这项工作

【问题讨论】：

这很简单，因为包含 first 1 ,first 2, first 3 的方法是来自 Web 服务的响应。其余的将在得到响应之前执行。如果你想按这个顺序使用它，你应该在 web 服务的响应中移动函数。
我试过这样但还是不行：getCompanies(): string[] { var appl: string [] = [] ; this.db.database.ref("companies/details/app/").on('value', function (snap) { snap.val().name.split(",").forEach(x => appl .push(x))});返回应用程序； }
return appl 也应该在里面
但我已经在 on 函数之外定义了 appl .. 这一行，getCompanies(): string[] {" . >>>>>> "function should return value" ,

标签： angular typescript

【解决方案1】：

您正在记录并返回 appl 外部回调函数，这就是为什么第二个在第一个之前获取日志。

将应用程序的日志记录和返回放在回调函数中，如下所示：

getCompanies(): string [] {
var appl: string []  = [] ;

this.db.database.ref("companies/details/app/").on('value', function (snap) {

  snap.val().name.split(",").forEach(function(x:string){
    appl.push(x);
    console.log(">>>first "+appl.length);
  });
  
       console.log("Reached here ");
       console.log(">>>second "+appl.length);
       
 return appl;

 });

【讨论】：