当前位置: 首页 > 知识库问答 >
问题:

ngOnInit在禁用区域后不会触发。角5中的js

蒋承教
2023-03-14

我最近将我的Angular应用程序从4.3升级到5.0,并试图围绕其中的一些新功能进行游戏。其中之一是消除zone.js.的依赖性

main.ts:

platformBrowserDynamic().bootstrapModule(AppModule, {
  ngZone: 'noop',
});

组成部分:

import { ApplicationRef, Component } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { Subscription } from 'rxjs/Rx';

import { MenuService } from '../../services/menu.service';

@Component({
  selector: 'ba-menu',
  templateUrl: './baMenu.html',
  styleUrls: ['./baMenu.scss'],
})
export class BaMenu {
  menuItems: any[];
  protected _menuItemsSub: Subscription;
  protected _onRouteChange: Subscription;

  constructor(public _router: Router, public _service: MenuService, public app: ApplicationRef) {
    console.log('constructor triggered'); //This worked
    this.app.tick();
  }


  ngOnInit(): void {
    console.log('ngOnInit() triggered'); //This doesn't worked
    this._onRouteChange = this._router.events.subscribe((event) => {

      if (event instanceof NavigationEnd) {
        if (this.menuItems) {
          this.selectMenuAndNotify();
        } else {
          // on page load we have to wait as event is fired before menu elements are prepared
          setTimeout(() => this.selectMenuAndNotify());
        }
      }
    });

    this._menuItemsSub = this._service.menuItems.subscribe(this.updateMenu.bind(this));
  }

  public ngOnDestroy(): void {
    console.log('ngOnDestroy() triggered'); //This worked
    this._onRouteChange.unsubscribe();
    this._menuItemsSub.unsubscribe();
  }

}

在我的组件中,Ngondestory()事件被触发,但ngOnInit()没有被触发。由于ngOnInit()不起作用,_onRouteChange永远不会初始化,我在这一行得到错误_onRouteChange。取消订阅();在恩格德斯特罗。

错误:

区js:690未处理的promise拒绝:无法读取未定义的属性“unsubscribe”;区域:;任务:promise。然后值:TypeError:无法读取未定义的属性“unsubscribe”

共有1个答案

强硕
2023-03-14

您还没有在组件代码中实现OnInit

//Change here
export class BaMenu implements OnInit {
  menuItems: any[];
  protected _menuItemsSub: Subscription;
  protected _onRouteChange: Subscription;

  ngOnInit() {
     //Some code
  }
  //Some code

}
 类似资料:
  • 我目前正在迁移(创建新的firebase项目),从美国-中央1到亚洲-东南2。我正在使用Firestore,Firebase存储和云功能。 我对Firebase存储和Firestore没有任何问题,我可以按照预期保存数据。因为可能firestore和firebase存储都在默认位置(asia-southeast2)。 问题出在云功能上。asia-southeast2没有云功能。所以我将我的可调用云

  • 问题内容: 我正在尝试在应用程序中使用AngularJS,并在某种程度上取得了成功。 我能够获取数据并将其显示给用户。我有一个按钮,我想通过该按钮发布DELETE请求。下面是我的代码。 这是获取信息并将其显示给用户的功能。 数据已获取并正确显示。 但是,单击删除按钮后,不会触发其中的代码。在GoogleChrome浏览器的开发人员工具中,我可以看到为代码生成了有效值,但未触发代码。从我尝试去掉花括

  • 我的效果在出错时,调用服务中的方法来显示对话。当对话完成时,它会将结果放入可观察的。 我有一个组件正在监听该服务中的可观察内容。问题是,组件第一次侦听服务,然后什么也听不到。 我正在设置该主题以避免收到错误消息,即第一次this.errorService.errorExist$没有返回任何内容。 错误服务 成分

  • 我有一个包含复杂输入(一些图表数据)的子组件。在获得 API 响应后,我通过 Angular 5 中的 @Input() 装饰器从父组件发送此图表数据。因此,每次在父组件上更改图表时,我都需要根据API响应同步图表,因此,OnChange生命周期。但不幸的是,我无法让它正常工作。我尝试使用基本数字类型设置虚拟输入字段并递增它,但徒劳无功。这是我的实现: 子图表组件: 父组件html: 父组件: P

  • 我正在学习Angular 5+,最近来到主题/订阅部分,我看到很多教程都希望以特定的方式使用订阅: 在组件中声明订阅 通过服务的主题或ngrx/store在ngOnInit中订阅 在ngondestroy中取消订阅 null

  • 问题内容: 对于jQuery,这是一个非常奇怪的问题。我正在加载一个div 页面加载。每条记录都是表格数据,并带有与之关联的“删除” ajax函数。当页面加载并单击“删除”链接时,ajax调用会触发。但是,一旦触发事件,就会从ajax调用返回数据,并且div中会填充数据(但页面不会刷新或重新加载)。当我再次单击链接时,ajax脚本将不会触发。这是我的代码: 问题答案: 当您删除元素然后通过java