Question

我正在使用Angular和RxJS编写项目。我实现了可注入的类，它从JSON中检索数据，如下所示：

public class User{
  private List<Category> categories;

   public void getCategories() {
      return categories;
   }

   public void findCategory(String categoryName) {
       // your logic here
   }

   public void findCategory(Predicate predicate)  {
        // your logic here
   }

}

将RosterService注入AppComponent的构造函数后（包括作为提供者包含在@Component中）：

import {Injectable, Inject} from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/add/operator/map';

import {Student} from './student.data';

@Injectable()
export class RosterService {
    private students : Student[];
    constructor(@Inject(Http) private http:Http){}

    private getStudents(){
        this.http.get('/JSON/students.json')
            .map(data => data.json().students)
            .subscribe(data => this.students = data);
    }

    public getRoster() {
        this.getStudents();
        return this.students;
    }
}

但是当我调用getRoaster（）方法时，它不会等到执行getStudents（async get call）。结果我得到了未定义的值。

我该如何处理？谢谢你的回应。

Answer 1

我会使用回调函数，例如，如果它是一个承诺，那么我会使用类似下面的内容。

var data;
asyncCall().then((result:any) => {
data = reuslt;
return data;
});

不确定这是不是你想要的。

<强>更新

        @Injectable()
    export class RosterService {
        private students : Student[];
        constructor(@Inject(Http) private http:Http){}

        private getStudents(){
            return this.http.get('/JSON/students.json')
                .map(data => data.json().students)
                .subscribe(data => this.students = data);
        }

        public getRoster() {
           return this.getStudents().then (() =>{
    return this.students;
           });        
         }
       }

在AppComponent中

export class AppComponent {
    public students : Student[];
    constructor(private _rosterService : RosterService) {
        this._rosterService.getRoster().then ((data:<T>)=>{
        this.students =data;
     });
    }
 }

Answer 2

在我看来，您从根本上错过了Javascript中的关键设计模式，即回调。

不是从函数返回一个值，而是传递一些代码，以便在函数良好且准备就绪时执行。

function doSomething(success) {
    var data = 1;
    // blah blah blah, something happens.
    success(data);
}

function myFunction(data) {
    console.log(data);
}

doSomething(myFunction);

这样，你就可以保持调用的异步性，这不会阻止Javascript可用的单个线程。

Answer 3

我假设您的异步函数返回promises。

首先，逻辑在那里有点奇怪.. data的范围是函数，func无法访问data。

这是可能想要做的事情：

function() {
  return func().then(data => data)
}

除此之外与此相同：

function() {
  return func()
}

..在这种情况下，你也可以用func替换该函数！

func

（或func是某个其他对象() => func()的属性。）

编辑：这个新函数是一个异步函数，所以它当然会返回一个promise。您以后需要使用.then来获取数据。

在Angular中的异步函数后返回

3 个答案: