如何创建一个带有值的服务函数并在Angular 2中返回一个observable?

时间:2017-02-08 20:29:14

标签: angular observable

我的服务: -

    @Injectable()
    export class MyService {

        doStuff(value){
             //Do stuff and when done return new data

             return newData;
        }

    }

我的组件: -

    export class MyComponent implements OnInit {
        constructor(private _myService: MyService){}

        ngOnInit() {
            this._myService.doStuff(value)
            .subscribe((data) => {
                console.log("new data: ", data);
            })
        }
    }

所以我的问题是,如何让doStuff()函数返回一个可观察的。此外,我想订阅所述函数,同时传递一个值。我该怎么办?

我让它工作在哪里我将变量设置为新的Subject()(在我的服务中) - 然后我在所述变量上调用.next()并将值传回。唯一的问题是我必须调用我的doStuff()函数然后订阅变量,如下所示: -

我目前的服务: -

    @Injectable()
    export class MyService {
        myData:any = new Subject<any>();
        myDataAnnounce = this.myData.asObservable();

        doStuff(value){
             //Do stuff and when done return new data
             this.myData.next(newData);
        }

    }

我当前的组件: -

    export class MyComponent implement OnInit {
        constructor(private _myService: MyService){}

        ngOnInit() {
            this._myService.doStuff(value);
            this._myService.myDataAnnounce
            .subscribe((data) => {
                console.log("new data: ", data);
            })
        }


    }

我想用我想传递的值进行一次调用,然后订阅。提前感谢您提供的任何帮助。

1 个答案:

答案 0 :(得分:1)

这很简单。正如@jonrsharpe所说,你只需要返回一些可观察的东西。有时我会使用相同的方法进行调试,或者如果我想在没有实际服务的情况下开始工作,那么我可以使用相同的方法进行调试。

@Injectable()
export class MyService {
    doStuff(value) {
         // When calling to real service is implemented 
         // you can just replace this with something like 
         //    return this.http.get(...).map(r => r.json());
         // If json response has the same structure as newData then 
         // your MyComponent will not even notice that something has changed.
         return Observable.of(newData);
    }
}

export class MyComponent implement OnInit {
    constructor(private _myService: MyService){}

    ngOnInit() {
        this._myService.doStuff(value).subscribe((data) => {
            console.log("new data: ", data);
        });
    }
}