订阅在Angular服务中不工作.异步问题

Question

我有一个表格，用户进入Linux用户名和日期。此信息用于在数据库中创建一个新的"委托"条目。在我致电我的REST API之前，我需要将此Linux用户名转换为相应用户记录的主要键

{ 
   'delegator': <user pk>, 
   'delegatee': <user pk>, 
   'expiration': <string for data YYYY-MM-DD>
}

所以我有此服务，可以从数据库中获取用户：

import { Injectable } from '@angular/core';
import {Headers, Http } from '@angular/http';
import 'rxjs/add/operator/toPromise';
import 'rxjs/add/operator/map';
import {environment} from '../../../environments/environment';
@Injectable()
export class UserService {
  private headers = new Headers({'Content-Type': 'application/json'});
  constructor(private http: Http) {}
  getUsers(login: string)  {
    var url = environment.apiUrl + '/api/v1/users' + '/?autocomplete=1&login=' + login + '&type=employee';
    return this.http.get(url).map(res => <string[]>res.json());
  }
}

服务返回格式的字符串数组："login:user_id"。UserService正常工作，因为我将在下面显示。

我在另一个服务中调用getUsers() DelegationsService。这是DelegationsService中定义的方法，该方法调用getUsers()：

export class DelegationsService {
  private headers = new Headers({'Content-Type': 'application/json'});
  delegatees: string[];
  constructor(private http: Http, private userService: UserService) {}
  newDelegation (delegator: number, delegatee_login: string, expiration: string) {
    // translate the login of the delegatee_login into the userid for the delegatee.
    var resp = this.userService.getUsers(delegatee_login).subscribe((delegatees) => {
        this.delegatees = delegatees;
        console.log(this.delegatees);
        console.log( this.delegatees[0]);
        var delegatee_id = this.delegatees[0].split(':')[1];
        console.log( 'newDelegation line 42 : ' + delegatee_id );
    });
    if ( this.delegatees ) {
        console.log( 'newDelegation line 52 : ' + this.delegatees[0] );
    } else {
        console.log( 'newDelegation line 54 no delegatees returned' );
    }
    // make a fake body since we can't the the delegatee's user id.
    var body = { 'delegator': delegator.toString(), 'delegatee': '9999', 'expiration': expiration };
    console.log(body);
    return this.http.post(environment.apiUrl + '/api/v1/delegation', body );
  }

需要注意的一些事情：我在subscribe()内有调试代码，证明我确实从getUsers()调用中获取数据。

当newDelegations()被调用时，我的浏览器中的控制台输出是：

newDelegation line 54 no delegatees returned
delegations-service.services.ts:57 {delegator: "975197", delegatee: "9999", expiration: "4000-04-04"}
delegations-service.services.ts:39 ["red:880922"]
delegations-service.services.ts:40 red:880922
delegations-service.services.ts:42 newDelegation line 42 : 880922

正如我们从第39行之前的第54行中的输出中看到的那样。此外，第39行的订阅代码块将数据从getUsers()调用返回，而第54行则没有。

我在做什么错？

更新：我根据ihazcode提出的建议。

。

  newDelegation (delegator: number, delegatee_login: string, expiration: string) {
    this.userService.getUsers(delegatee_login).subscribe((delegatees) => {
        this.delegatees = delegatees;
        console.log(this.delegatees);
        console.log( this.delegatees[0]);
        var delegatee_id = this.delegatees[0].split(':')[1];
        console.log( 'newDelegation line 42 : ' + delegatee_id );
        var body = { 'delegator': delegator.toString(), 'delegatee': delegatee_id, 'expiration': expiration };
        console.log(body);
        return this.http.post(environment.apiUrl + '/api/v1/delegation', body );
    });
  }

上述代码执行时，在我的浏览器中的"网络"选项卡中未出现对/api/v1/委托的帖子调用。只是 getUsers()执行的get((请求。

更新II。这是调用newDelegation()。

的代码

export class DelegationDetailComponent implements OnInit {
  userid: number;
  login: string;
  @Input() delegation: Delegation;
  constructor(
    private delegationService: DelegationsService,
  ) {
    // faking this for now until authentication is working.
    this.userid = 975197;
    this.login = 'red2';
  }
...
  onSubmitNewDelegation(f: NgForm): void {
    console.log( 'Update delegation with id ' + f.value.delegator);
    this.delegationService.newDelegation(
                   f.value.delegator,f.value.delegatee,f.value.expiration);
    }
    ...

Answer 1

请尝试：

    onSubmitNewDelegation(f: NgForm): void {
        console.log( 'Update delegation with id ' + f.value.delegator);
        this.delegationService.newDelegation(
                       f.value.delegator,f.value.delegatee,f.value.expiration).subscribe((result) => {
      console.log(result);
   });
}

希望这会有所帮助。

P.S。我只有将结果发送到控制台，因此您可以检查或网络选项卡以确保您的帖子现在发生。

Answer 2

简单的解决方案是从if语句中移动所有内容：

if (this.delegatees) etc...

进入您的(async(getuser的订阅块。

希望这会有所帮助

即。

var resp = this.userService.getUsers(delegatee_login).subscribe((delegatees) => {
        this.delegatees = delegatees;
        console.log(this.delegatees);
        console.log( this.delegatees[0]);
        var delegatee_id = this.delegatees[0].split(':')[1];
        console.log( 'newDelegation line 42 : ' + delegatee_id );
    if ( this.delegatees ) {
        console.log( 'newDelegation line 52 : ' + this.delegatees[0] );
    } else {
        console.log( 'newDelegation line 54 no delegatees returned' );
    }
    // make a fake body since we can't the the delegatee's user id.
    var body = { 'delegator': delegator.toString(), 'delegatee': '9999', 'expiration': expiration };
    console.log(body);
    return this.http.post(environment.apiUrl + '/api/v1/delegation', body );
    });
}