4 回答

• 9

  我认为您在 indexes 属性中设置的值不是数组而是对象 .

  我会看到几个原因：

  • 您从 getIndexes 方法收到响应而不是有效负载 . 在这种情况下，您可以在此方法中使用 map 运算符：

  getIndexes() {
    return this.http.get(...).map(res => res.json());
  }
  

  • 收到的有效负载与数组不对应，但与某些属性相对应 . 在这种情况下，您需要将此属性设置为 indexes 属性 .

  如果要迭代对象的属性，则需要实现如下自定义过滤器：

  @Pipe({name: 'keyValues'})
  export class KeysPipe implements PipeTransform {
    transform(value, args:string[]) : any {
      let keys = [];
      for (let key in value) {
        keys.push({key: key, value: value[key]);
      }
      return keys;
    }
  }
  

  并使用它：

  <div class="div_IndxPartition" *ngFor="#indObj of indexes | keyValues">
    (...)
  </div>
  

  看到这个问题：

  • How to display json object using *ngFor

  回复于 2024-04-27T19:26:53+08:00
• 0

  你应该试试这个：

  In html:

  <div  *ngFor="let subsciption of subscriptions;">
                       <div class="col-md-6">
                          <h5 class="widget-title">{{subsciption.name}}</h5>
                      </div>
  </div>
  

  in .ts file:

  export class SubscriptionComponent implements OnInit {
          private subscriptions: any =[]; 
          // private subscriptions: any ={};    // here dont use {}
      .
      .
      .
      .
      .
  
          getAllSubscriptions(queryString) {
              this._http.get(`${environment.base_url}/subscriptions` + queryString)
                  .subscribe((response: Response) => {
                      this.subscriptions = response.json();
                  },
  
                  (error: Response) => {
                      console.log("Login error");
                  });
          }
          this.getAllSubscriptions(query);
  
      }
  

  回复于 2024-04-27T19:26:53+08:00
• 0

  我有同样的问题，我的解决方案是没有管道 . 我没有在返回Observer的模板中使用变量，创建中间变量并为其分配结果 . 例如，我们将流保存到 this.sub 但结果将在成功回调时保存为 this.indexes ，并将在html模板中使用此变量 .

  @Component({
    template: `
  <ul>
    <li *ngFor="let index of indexs">
      {{ index }}
    </li>
  </ul>
  `
  })
  export class HomeComponent {
    privat sub;
    public indexes:Array<Index>=[];
    public error;
  
    constructor(private _service: HomeService) {
      this.sub = this._service.getIndexes().subscribe(
          data => this.indexes =  JSON.parse(data),
          error => alert(" Error is : " + error),
          () => console.log("finished")
       );
  
    }
  }
  

  回复于 2024-04-27T19:26:53+08:00
• 1

  使用Observable时，您不想使用管道 . 这个错误是非常通用的，最好的方法是抛出一个console.log（）并查看你出错的地方，因为它可能是很多东西 .

  我的问题是我的Array在Object中，我试图遍历Object . 其他问题可能包括映射或ngFor . 我的控制台输出看起来像这样：

  this.indexes = _service.getIndexes()
           .subscribe(
              data => {
                  this.indexes = JSON.parse(data);
                  console.log(indexes);
              },
              error => alert(" Error is : " + error),
                  ()=> console.log("finished")
           );
      console.log(this.indexes);
  

  所以我需要的修复是这样的：

  this.indexes = _service.getIndexes()
               .subscribe(
                  data => {
                      this.myNewObject = JSON.parse(data);
                      this.indexes = this.myNewObject.indexes;
                  },
                  error => alert(" Error is : " + error),
                      ()=> console.log("finished")
               );
          console.log(this.indexes);
  

  这是因为数组嵌套在Object中，所以我只是创建了一个新对象并通过获取其属性来访问该数组 .

  回复于 2024-04-27T19:26:53+08:00