用户通过用户页面更新后,如何使应用程序标题静态化?
How can I make application title static after user update it though user page?
我正在为应用程序组件的模板设置标题。标题已通过用户页面上的用户输入进行更新。如何在整个应用程序中使用该标题?
我已经尝试通过本地存储进行工作,但是有没有其他方法可以让它在整个应用程序中可用?
Stackblitz URL:https://stackblitz.com/edit/angular-kfptvs
[更新]
当我在我的另一个应用程序上实现相同的功能时,我开始收到错误消息:
Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'null: Bob'. Current value: 'null: Rob'.
执行以下代码时出现上述错误:
this._userService.titleObs.subscribe((title) => {
this.title = title;
})
我已经通过下面的代码修复了,但是有人可以建议更好的修复方法吗?
this._userService.titleObs.subscribe(
title => setTimeout(() => this.title = title, 0)
);
正如 Maryannah 所说,您使用的服务是解决问题的好方法。它对您不起作用的原因可能是因为您的服务位于临时文件夹下。如果将服务放在根文件夹中,所有组件都将能够访问相同的数据。
为此使用该服务是一个很好的方法。对于导航,您应该使用路由器链接而不是通过 <a>
标签导航。这样可以避免重新加载页面。
问题已通过添加 ChangeDetectorRef
解决
import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
constructor(
private ref: ChangeDetectorRef
){}
this._userService.titleObs.subscribe((title) => {
this.title = title;
this.ref.detectChanges()
})
我正在为应用程序组件的模板设置标题。标题已通过用户页面上的用户输入进行更新。如何在整个应用程序中使用该标题?
我已经尝试通过本地存储进行工作,但是有没有其他方法可以让它在整个应用程序中可用?
Stackblitz URL:https://stackblitz.com/edit/angular-kfptvs
[更新]
当我在我的另一个应用程序上实现相同的功能时,我开始收到错误消息:
Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'null: Bob'. Current value: 'null: Rob'.
执行以下代码时出现上述错误:
this._userService.titleObs.subscribe((title) => {
this.title = title;
})
我已经通过下面的代码修复了,但是有人可以建议更好的修复方法吗?
this._userService.titleObs.subscribe(
title => setTimeout(() => this.title = title, 0)
);
正如 Maryannah 所说,您使用的服务是解决问题的好方法。它对您不起作用的原因可能是因为您的服务位于临时文件夹下。如果将服务放在根文件夹中,所有组件都将能够访问相同的数据。
为此使用该服务是一个很好的方法。对于导航,您应该使用路由器链接而不是通过 <a>
标签导航。这样可以避免重新加载页面。
问题已通过添加 ChangeDetectorRef
import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
constructor(
private ref: ChangeDetectorRef
){}
this._userService.titleObs.subscribe((title) => {
this.title = title;
this.ref.detectChanges()
})