Question

我有某种方法的服务。此方法预订服务，而不预订组件。结果在message.content中。

代码如下：

服务方法：

myMethod() {
    this.socket$.subscribe(
        (message) => {
          console.log(`${message.content}`);
        }
    );
}

应用组件

contentVariable;
ngOnInit() {
    this.myservice.myMethod();
}

我的问题是...如何将来自服务的message.content转换为组件中的contentVariable？

Answer 1

您可以使用promise从subscribe方法返回一个值。

myMethod() {

    return new Promise(resolve=>{ 
       this.socket$.subscribe(
        (message) => {
          resolve(message.content);
        }
    );
   });

  }

在您的component.ts中，使用promise then()方法将值分配给contentVariable

contentVariable;

  ngOnInit() {


    this.myservice.myMethod().then(val => this.contentVariable = val);


  }

Answer 2

可以有两个选择。

根据您的代码，您必须返回消息结果，以便可以访问组件方法。

在使用中，

myMethod（）{

this.socket$.subscribe(
    (message) => {
      return message.content
    }
);

}

编辑：

如果您正在服务中进行任何api调用，例如，您可以像下面提到的那样进行订阅：

服务：

url ='localhost：3000';

api = ${url}/api/get/users;

getUsers（）{

返回此。http.get（api）

}

组件： ngOnInit（）{

this.service.getUsers（）。subscribe（（res）=> {

console.log（res）

}）

}

Answer 3

仅从您的服务中返回message.content。

服务端：

myMethod() {
this.socket$.subscribe(
    (message) => {
      return message.content;
    });

}

组件方面：

contentVariable: any;

ngOnInit() {

   this.contentVariable = this.myservice.myMethod();
}

Answer 4

我将从组件中进行订阅，但是，您可以在服务中设置属性：

Description

并在组件中使用该服务的属性。

Answer 5

您必须利用Subject来实现。

服务方法：

content$ : Subject<string> = new Subject<string>()
myMethod() {
    this.socket$.subscribe(
        (message) => {
          this.content$.next(message.content)
          console.log(`${message.content}`);
        }
    );

  }

应用组件

contentVariable;

ngOnInit() {   
    this.myservice.content$.subscribe(content => this.contentVariable = content)
    this.myservice.myMethod();
}

Answer 6

您的服务方法需要返回可观察值。您可以使用tap来查看数据而无需订阅，这将使您的服务能够像您尝试的那样对其进行记录。然后，组件订阅返回的observable。服务

import { tap } from 'rxjs/operators';
import { Observable } from 'rxjs';

// class name, constructor, etc omitted

myMethod() : Observable<{content: string}> {
    return this.socket$.pipe(tap((message) => console.log(`${message.content}`)));
}

组件

contentVariable;
ngOnInit() {
    this.myservice.myMethod().subscribe(_ => this.contentVariable = _.content);
}

带有订阅的Angular Service方法在组件变量

6 个答案: