typescript Angular getCurrentNavigation().extras

xjreopfe 于 2023-01-18 发布在 TypeScript

关注(0)|答案(4)|浏览(144)

我从我的组件发送数据沿着路由，我想在另一个组件的构造函数中检索它：

正在发送数据：

this.router.navigate(['/coaches/list'], {
          state: { updateMessage: this.processMessage },
          replaceUrl: true
        });

正在构造函数中检索数据：

if (this.router.getCurrentNavigation().extras?.state != null) {
  this.successMessage = this.router.getCurrentNavigation().extras.state;
}

我遇到的问题是第一次extras.state没有定义，没有任何数据，只有当我关闭另一个组件中的对话框按钮时，这个变量才会被填充。
当我收到ERROR TypeError时，请告诉我如何解决此问题：无法在初始加载中读取null的属性“extras”。

typescript

来源：https://stackoverflow.com/questions/67715879/angular-getcurrentnavigation-extras

4条答案

按热度按时间

o2g1uqev1#

您可以通过以下方式访问状态：

history.state.updateMessage

赞(0）回复(0）举报 2023-01-18

yhxst69z2#

我可以通过检查getCurrentNavigation是否为空来解决此问题：

constructor(
    private fb: FormBuilder,
    private modalService: NgbModal,
    private route: ActivatedRoute,
    private router: Router,
    public commonService: CommonService
  ) {
    if (this.router.getCurrentNavigation() != null) {
      this.successMessage = this.router.getCurrentNavigation().extras.state;
    }
  }

赞(0）回复(0）举报 2023-01-18

bqujaahr3#

你可以把它简化为一行代码，如果getCurrentNavigation()是不真实的，那么你的消息就等于null：

this.successMessage = this.router.getCurrentNavigation()?.extras.state;

或者，如果您希望指定空值，则为：

this.successMessage = this.router.getCurrentNavigation()?.extras.state ?? 'YOUR VALUE';

赞(0）回复(0）举报 2023-01-18

7y4bm7vi4#

从Angular 15开始，this.router.getCurrentNavigation()可能返回null，因为组件是在导航之后示例化的。
另一种方法是从Location访问状态（从@angular/common访问状态）

import { Location } from '@angular/common';

  constructor(private location: Location) {
    location.getState() // do what you want 
  }

赞(0）回复(0）举报 2023-01-18

我来回答

typescript Angular getCurrentNavigation().extras

4条答案

相关问题

热门标签

最新问答