for 循环中的代码在 ngOnInt() 中不起作用

如何解决for 循环中的代码在 ngOnInt() 中不起作用

我在 ng OnInit 中运行 for 循环时遇到问题，我有一个包含方法 getAllNews() 的服务，它返回一个 arrya 而不是 observable 我提到这个是为了让你知道我不能使用 subscribe()方法，所以当我控制台记录这获取所有新闻时，它会为我显示数组，因此数组不是空的，但是当我尝试在此数组内循环时，即使是简单的 console.log() 循环也没有任何作用，我尝试使用 for和 Foreach()，我想我错过了一些非常简单的东西，但我无法弄清楚出了什么问题，因为我是 angular 的新手。这是我的 component.ts 文件：

 import { Component,OnInit } from '@angular/core';
 import { ActivatedRoute,Router } from '@angular/router';
 import { element } from 'protractor';
 import { CovidService } from '../covid.service';
 import { News } from '../models/news.model';

@Component({
  selector: 'app-inside-news',templateUrl: './inside-news.component.html',styleUrls: ['./inside-news.component.css']
   })
   export class InsideNewsComponent implements OnInit {

    getAllNews: any[] = []
    currentNews: News = new News(new Date,"","") ;
    current: any ; 

    constructor(private covidService : CovidService,private route : ActivatedRoute,private router 
         : Router) { }

    ngOnInit(): void {



   this.current = this.route.snapshot.paramMap.get('title') ;
    this.getAllNews = this.covidService.getAllNews()
    console.log(this.getAllNews)
    for(var element in this.getAllNews)
{
  console.log(this.getAllNews[element])
  
   } 


    }



      } 

我也尝试过这种方式，但我遇到了同样的问题，函数中的第一个控制台日志显示了一个包含我的数据的完整数组，但循环中的第二个 console.log 不起作用：

 import { Component,Router } from '@angular/router';
 import { element } from 'protractor';
 import { CovidService } from '../covid.service';
 import { News } from '../models/news.model';

@Component({
 selector: 'app-inside-news',styleUrls: ['./inside-news.component.css'] 
})
  export class InsideNewsComponent implements OnInit {

  getAllNews: any[] = []
  currentNews: News = new News(new Date,"") ;
  current: any ; 

   constructor(private covidService : CovidService,private router 
   : Router) { }

   ngOnInit(): void {



     this.getCurrentNews() ; 




  } 

getCurrentNews() {
this.current = this.route.snapshot.paramMap.get('title') ;
this.getAllNews = this.covidService.getAllNews()
console.log(this.getAllNews)
for(var element in this.getAllNews)
{
  console.log(this.getAllNews[element])
 
 
 }


  }
 }

这是我得到的数组，并在我控制台记录 getAllNews() 时尝试循环

getAllNews array

这是服务中的功能

 getAllNews(){
let news =  firebase.firestore().collectionGroup("news") ; 
let newsData : any[] = [] ;
let test : any ;  
news.get().then((querySnapshot)=>{ querySnapshot.docs.forEach( element =>{  
 newsData.push(element.data())})}) ;
  // console.log(newsData)
   return newsData ;   
   
    }

解决方法

我认为您试图以错误的方式访问数组。请尝试如下代码=>

ngOnInit(): void {
     for(let news of this.getAllNews){
       console.log(news.Info);//Here Info I presume as a property.
     }
   }

或

ngOnInit(): void {
         for(let news in this.getAllNews){
           console.log(this.getAllNews[news].Info);//Here Info I presume as a property.
         }
       }

注意：请检查并尝试并告诉我。

,

实际数据的工作示例

这是一个使用 angular 数组的示例。如果您的数组中有一个值列表，这将 100% 有效。

请参考所附图片。Updated the logics with actual data