CODEWITHSUNDEEP
angulartypescript
oni3619
oni3619

Reputation: 153

Unable to solve Maximum call stack size exceeded

core.js:4442 ERROR RangeError: Maximum call stack size exceeded
    at SafeSubscriber.__tryOrUnsub (Subscriber.ts:271)
    at SafeSubscriber.next (Subscriber.ts:207)
    at Subscriber._next (Subscriber.ts:139)
    at Subscriber.next (Subscriber.ts:99)
    at BehaviorSubject.Subject.next (Subject.ts:70)
    at BehaviorSubject.next (BehaviorSubject.ts:43)
    at SharedService.push.r2F1.SharedService.setTitleInfo (shared.service.ts:92)
    at AppComponent.push.Sy1n.AppComponent.nameChangeFunction (app.component.ts:190)
    at app.component.ts:167
    at SafeSubscriber.schedulerFn [as _next] (core.js:24931)

The above is the error.

The code in the app.component.ts

I am getting a lot confused as why this error is occuring in the console?

ngAfterViewChecked() {
        this.titleSubscription = this.sharedService.getTitleValue()
        .subscribe(item => {
            this.customNameData = false;
            if (item === 'View My Request' || item === 'Request Management') {
            this.nameChangeFunction(item)
            }
            const substring = 'customNameData';
            if (item.includes(substring)) {
                const length = item.length;
                const res = item.substr(14, length);
                this.title = res;
                this.customNameData = true;
            } else {
                this.title = item
            }
        });

        this.routerLinkSubscription = this.sharedService.getRouterLinkValue()
        .subscribe(item => {
                this.routerLink = item
        });

        this.cdr.detectChanges();
     }

     nameChangeFunction(item) {
        if (item === 'View My Request' || item === 'Request Management') {
          this.sharedService.setTitleInfo({
            data: item
          });
        }
    }

The code at the shared.service.ts Altough I did try to empty the stack but it dosen't to have worked fine in my case. Not sure what can be a solution.

setTitleInfo(name: any) {
    this.setTitle.next(null);
    this.setTitle.next(name);
  }

Can anybody tell me what wrong am I doing over here?

Upvotes: 0

Views: 805

Answers (1)

Brian Smith
Brian Smith

Reputation: 1656

Import Title and Router into app.component.ts constructor

constructor(private router: Router,
            private titleService: Title) { }

Then on ngOnInit() subscribe to router events.

this.router.events.subscribe(data => {
      if (data instanceof ActivationStart) {
        var title = data.snapshot.data.title;
        if (title) {
          this.titleService.setTitle(title);
        }
        else {
          this.titleService.setTitle('Default Title');
        }
      }
    })

In each of your routes, set the title in data:

{
   path: 'Path Name',
   data: { title: 'Route Title' },
   component: YourComponent,
},

Upvotes: 1

Related Questions