【问题标题】:Angular subscribe, how do I make a method have a subscriptionAngular订阅,我如何让一个方法订阅
【发布时间】:2018-01-01 01:33:38
【问题描述】:

我是 Angular 2 的新手,不知道如何订阅。 我有一个类似于(简单版)的会员服务:

import { Injectable, NgZone, Output, EventEmitter } from '@angular/core';
import { Network } from '@ionic-native/network';
import { HttpProvider } from '../providers/http-provider';

@Injectable()
export class Member {

  firstName:string = "";
  surname:string = "";

  constructor(private httpProvider: HttpProvider, private network: Network, zone: NgZone) {
  }

  createMember(member){
    this.httpProvider.createMember(member).subscribe(
      result => {
        var data = JSON.parse( result['_body'] );
        this.firstName = member.FirstName;
        this.surname = member.Surname;
        return true;
      },
      err =>{
        console.error("Error : "+err);
        return false;
      }
    );
  }
}

然后我有另一个使用会员服务的组件,我想要类似的东西:

this.member.createMember(member).subscribe(data)....

所以我可以检查成员是否已成功创建。

【问题讨论】:

    标签: angular callback ionic2 promise subscribe


    【解决方案1】:

    我会做这样的事情

    组件

     this.membersService.createMember(member)
         .subscribe(res => {
             console.log('success', res)
            }, err => {
              console.log('error', err);
            });
    

    服务

    import {Injectable} from '@angular/core';
    import {Http, RequestOptions, Response, Headers} from '@angular/http';
    import 'rxjs/Rx';
    
      createMember(member) {
        const body = JSON.stringify(member);
        const headers = new Headers({
          'Content-Type': 'application/json'
        });
        const options = new RequestOptions({headers: headers});
    
        return this.http.post('/api/members', body, options)
          .map((res: Response) => res.json())
          .catch((err: any) => console.log(err));
      }
    

    【讨论】:

    • 我不会费心完成我的答案,它几乎是一样的 - 但你应该提到createMember 不会真正发送请求,直到有人订阅它。 (替代方法是使用 Subject)您可能还会发现 syntax highlighting 对 typescript sn-ps 很有用
    猜你喜欢
    • 2020-10-11
    • 2021-05-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-01-28
    相关资源
    最近更新 更多