Type Script # 总是得到大小为零的数组

Question

我正在尝试使用以下代码从我的 Auth.service 方法 getSpams() 中获取 Home.ts 中所有垃圾邮件的值，该方法运行很好并给出了结果在控制台中正确。但是，当我尝试将服务结果保存在 Home.ts 的 Object(totalspam) 中时，它给出的数组大小为零。

以下是我的组件：

Home.ts

    import { NavController , IonicPage} from 'ionic-angular';
    import { Component } from '@angular/core';
    import { AuthService } from '../../providers/auth-service/auth-service';
    import { Spam } from '../../providers/auth-service/auth-service';
    import {Observable} from 'rxjs/Observable';
    @IonicPage()
    @Component({
      selector: 'page-home',
      templateUrl: 'home.html'
    })
    export class HomePage {

      totalspam:Spam[] = [];

      constructor(public navCtrl: NavController,private auth:AuthService) {

         this.auth.getSpams().subscribe(spam=>{this.totalspam = spam});
         console.log(this.totalspam);

      }

    }

AuthService.ts

    getSpams(): Observable<Spam[]> {
              let url = 'http://115.113.49.148:8080/allspam';
              let headers = new Headers();
              headers.append('Content-Type', 'application/x-www-form-urlencoded');
              let options   = new RequestOptions({ headers: headers });

              // get spams from api
              return this.http.get(url, options)
                  .map((response) => response.json());
          }

AuthService.ts

    export class Spam
    {
      _id:string;
      count:Number;
      spamNumber:string;
      spamType:Array<String>;  
    }

Answer 1

您的问题是您在异步方法之后直接在控制台记录结果。此行： console.log(this.totalspam); 在值实际更改之前被调用。当您处理异步请求时，延迟、请求大小和浏览器本身等因素可能意味着可变的解析时间。

异步方法的目的是运行并在稍后处理结果而不阻塞任何其他代码，因此 console.log 被立即调用。如果您将代码更改为以下内容，只要您得到返回结果，您应该会看到填充的数组：

this.auth.getSpams().subscribe(spam => {
    this.totalspam = spam;

    console.log(this.totalspam);
});

如果您仍然没有看到任何东西，那么您应该检查您的请求是否返回了所需的结果。

Type Script # 总是得到大小为零的数组

Type Scripit # Always getting Array of zero size

javascript

node.js

typescript

mean-stack

angular2-services