0

我是 Angular 的新手。我正在使用路由器切换屏幕..像这样

this._router.navigate(['a_page'],{state: {data: moredata})

并像这样在 a_page 构造函数中获取状态

this._router.getCurrentNavigation().extras.state;

但是，如果我从 a_page 返回，然后使用浏览器转发按钮转发，则 extras.state 为空。我不知道如何以最好的方式做到这一点，请提出这个想法。谢谢你。

4

2 回答 2

1

您可以使用 typescript 访问器 setter 和 getter来实现所需的结果。

在您设置和获取价值的地方创建服务。

状态服务.ts

import { Injectable } from '@angular/core';

@Injectable({
 providedIn: 'root'
})
export class SomeService {
 _state;

 get state() {
  return this._state;
 }

 set state(data) {
  this._state = data
 }
}

get 和 set 可以从任何组件实现

export class StateComponent {
 // inject state service to access set get methods
 constructor(private service: StateService) {
  this.service.state =  { data: moredata }; // setting state

  console.log(this.service.state); // getting state from anywhere 
}

希望这有效。

于 2020-08-15T11:04:32.020 回答
0

您可以将单例服务与 Subject 一起使用，以便在组件之间共享数据（不需要状态管理库）。

使用 angular-cli 创建服务：ng generate service service-name

将服务注入需要共享相同数据的组件的构造函数中：

constructor(private service: MyService) {}

在您的服务中，声明一个负责保存数据的主题（一个 BehaviorSubject 是一个好主意，因为它是用一个值初始化的）：

data: BehaviorSubject<any> = new BehaviorSubject<any>('foo');

要从组件更改其值，请使用其next()上的方法：

constructor(private service: MyService) {}

update(): void {
  this.service.data.next('bar');
}

然后为了获得任何组件（或服务/指令......）中的最后一个值，订阅 BehaviorSubject 并使用该值做任何你想做的事情：

constructor(private service: MyService) {}

ngOnInit(): void {
  this.service.data.subscribe(value => {
  // do whatever
  });
}

每次next()在应用程序的某个地方使用该方法时，其他地方的任何订阅都将获得这个新值。

于 2020-08-15T09:51:21.673 回答