时间戳

首页 > 解决方案 > 两个组件之间的角度共享数据

angular - 两个组件之间的角度共享数据

问题描述

我正在尝试将一个服务的值共享到另一个组件，但值结果显示为未定义

Injectable()
export class TestService {
 url:string;

someExample(){
this.url="Hello";
}



@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {

  constructor(private test: TestService,
              ) { }

  doTest(){    
   console.log("CheckingValue"+ this.test.url)
  }
}

如何设置 url 值以便我可以在另一个组件上接收？我是角度新手，我可以在控制台中看到 this.test.url 值显示为未定义

标签： angularangular-components

解决方案

使用 Observable 订阅更改：

import { Observable, of } from 'rxjs';

Injectable()
export class TestService {
 url:string;

someExample(): Observable<string>{
 return of (this.url="Hello");
}

并在组件中获取/订阅它：

this.testService.someExample().subscribe(result => {
 console.log(result);
});

如果服务中的值发生变化，您将在组件中获得更新的值。

推荐阅读