TS7053: Элемент неявно имеет тип «любой», поскольку выражение типа «строка» не может использоваться для индексирования типа «Объект»

#java #html #css #angular #typescript

Вопрос:

Я пытаюсь публиковать данные напрямую с помощью templateDrivenForm и получать данные из fireBase, но показываю ошибку следующего типа.

Моя часть кодов

 //directly posts datas using submitButton from templateDrivenForm
 onCreatePosts(postDatas:{title:string, content:string}){
this.http.post('https://ng-complete-guide-b3d7f-default-rtdb.firebaseio.com/posts.json',
 postDatas)
.subscribe(
 responseData => {
  console.log(responseData);
 });
 }

 //get datas from database
   private fetchPost(){
     return this.http.get('https://ng-complete-guide-b3d7f-default-rtdb.firebaseio.com/posts.json')
   .pipe(map(responseData =>  {
     const dataArray = [];
    for(let key in responseData){
    if(responseData.hasOwnProperty(key)){
    dataArray.push({...responseData[key], id:key});
    }
  }
  return dataArray;
 }))
  .subscribe( responseData => {
  console.log(responseData)
 })
}
 

Моя ошибка в том, что

      Error: src/app/app.component.ts:40:28 - error TS7053: Element implicitly has an 'any' type 
      because 
     expression of type 'string' can't be used to index type 'Object'.
      No index signature with a parameter of type 'string' was found on type 'Object'.

     40         dataArray.push({...responseData[key], id:key});
 

Ответ №1:

решение

       private fetchPost(){
      return this.http.get('https://ng-complete-guide-b3d7f-default- 
      rtdb.firebaseio.com/posts.json')
    .pipe(map((responseData:{[data:number]:any}) =>  {
     const dataArray = [];
     for(let key in responseData){
  if(responseData.hasOwnProperty(key)){
    dataArray.push({...responseData[key], id:key});
  }
  }
    return dataArray;
  }))
 .subscribe( responseData => {
  console.log(responseData)
 })
 }

 .pipe(map((responseData:{[data:number]:any}) //object type
 

Комментарии:

1. я думаю, что ваш идентификатор-это строка, и вам следует избегать ее использования any как можно чаще. тип должен быть { [key:string]: { content: string, title: string } }

2. Можете ли вы объединить объект posts (хотя бы частично) в своей функции и показать, какие поля появляются? Но на вашем месте, вместо использования API REST (он очень ограничен по сравнению с библиотекой), я бы предложил использовать специальную библиотеку для работы с firebase для угловых npmjs.com/package/@angular/fire