如何在angular2的html页面中绑定数据对象但在重新加载后面临问题

克鲁纳尔

我使用这种方法进行绑定,但是当我重新加载页面时,它的工作停止

<div><h1>{{userdata?.firstname}}</h1></div> 

export class HomeComponent {

    constructor(private authenticationService : AuthenticationService) {
        userdata=this.authenticationService.user_data;
    }
}
迈克尔·索拉蒂

您的服务可能看起来像这样......

import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';

@Injectable()
export class AuthenticationService {
  private _user_data: BehaviorSubject<any> = new BehaviorSubject<any>(null);

  constructor() {
    this._restoreUser()
  }

  get user_data(): Observable<any> {
    return this._user_data.asObservable();
  }

  private _restoreUser(): void {
    let user: any;
    // use any code to restore user from cache and assign it to the scoped user variable
    this._user_data.next(user);
  }
}

在您的家庭组件中...

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Subscription } from 'rxjs/Subscription';

export class HomeComponent implements OnInit, OnDestroy {
  public userdata: any;
  private _userdataSub: Subscription;

  constructor(private authenticationService: AuthenticationService) { }

  ngOnInit() {
    this._userdataSub = this.authenticationService.user_data.subscribe((userdata) => {
      this.userdata = userdata;
    });
  }

  ngOnDestroy() {
    this._userdataSub.unsubscribe();
  }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Angular2:如何在angular2数据绑定中以html格式显示数据?

来自分类常见问题

如何在Angular2中绑定原始HTML

来自分类Dev

如何在ng-repeater中重新绑定数据

来自分类Dev

在Angular 2服务中绑定数据对象的正确方法?

来自分类Dev

如何在 Angular2 中从 HTML 获取对象

来自分类Dev

如何在打字稿Angular2中将JSON对象与变量绑定?

来自分类Dev

如何在View中绑定数据

来自分类Dev

在angular2中,如何在手动刷新/重新加载浏览器后保留html5控制值?

来自分类Dev

调用angular2绑定数据失败

来自分类Dev

调用angular2绑定数据失败

来自分类Dev

如何在Angular2中绑定列表?

来自分类Dev

如何在Angular2中绑定列表?

来自分类Dev

通过SignalR加载数据时在AngularDart中重新绑定页面

来自分类Dev

如何在函数级别获取 JSON 并在 Angular2 中的 HTML 页面上显示

来自分类Dev

Angular2 pathLocationStrategy:URL更改导致页面重新加载

来自分类Dev

Angular2 location.back() 页面重新加载?

来自分类Dev

如何绑定数据对象

来自分类Dev

如何在.net Core中绑定数据模型对象的属性名称

来自分类Dev

Angular2 和 Html 表单 - 存在两种数据绑定空白、必需、选定的问题

来自分类Dev

Angular 8-如何在页面上重新加载行为主题数据

来自分类Dev

Angular2绑定问题

来自分类Dev

如何在angular 6的下拉列表中设置双向绑定数据?

来自分类Dev

如何在 TableView 中重新加载数据

来自分类Dev

如何在vb.net中的页面加载时将datagridview绑定到数据库

来自分类Dev

如何将JavaScript重新绑定到angular2组件中的元素?

来自分类Dev

如何从asp.net中的代码后面绑定数据列表

来自分类Dev

如何在angular2 rc4中的引导程序上将数据加载到服务中

来自分类Dev

如何在 Angular 2 中的数据绑定后执行操作?

来自分类Dev

Django.如何在页面重新加载后保留表单字段中的数据?

Related 相关文章

  1. 1

    Angular2:如何在angular2数据绑定中以html格式显示数据?

  2. 2

    如何在Angular2中绑定原始HTML

  3. 3

    如何在ng-repeater中重新绑定数据

  4. 4

    在Angular 2服务中绑定数据对象的正确方法?

  5. 5

    如何在 Angular2 中从 HTML 获取对象

  6. 6

    如何在打字稿Angular2中将JSON对象与变量绑定?

  7. 7

    如何在View中绑定数据

  8. 8

    在angular2中,如何在手动刷新/重新加载浏览器后保留html5控制值?

  9. 9

    调用angular2绑定数据失败

  10. 10

    调用angular2绑定数据失败

  11. 11

    如何在Angular2中绑定列表?

  12. 12

    如何在Angular2中绑定列表?

  13. 13

    通过SignalR加载数据时在AngularDart中重新绑定页面

  14. 14

    如何在函数级别获取 JSON 并在 Angular2 中的 HTML 页面上显示

  15. 15

    Angular2 pathLocationStrategy:URL更改导致页面重新加载

  16. 16

    Angular2 location.back() 页面重新加载?

  17. 17

    如何绑定数据对象

  18. 18

    如何在.net Core中绑定数据模型对象的属性名称

  19. 19

    Angular2 和 Html 表单 - 存在两种数据绑定空白、必需、选定的问题

  20. 20

    Angular 8-如何在页面上重新加载行为主题数据

  21. 21

    Angular2绑定问题

  22. 22

    如何在angular 6的下拉列表中设置双向绑定数据?

  23. 23

    如何在 TableView 中重新加载数据

  24. 24

    如何在vb.net中的页面加载时将datagridview绑定到数据库

  25. 25

    如何将JavaScript重新绑定到angular2组件中的元素?

  26. 26

    如何从asp.net中的代码后面绑定数据列表

  27. 27

    如何在angular2 rc4中的引导程序上将数据加载到服务中

  28. 28

    如何在 Angular 2 中的数据绑定后执行操作?

  29. 29

    Django.如何在页面重新加载后保留表单字段中的数据?

热门标签

归档