आयनिक 2 टैब अधिकतम कॉल स्टैक आकार

Question

से अधिक हो गया यह त्रुटि Ionic 2 को हड़ताली एक प्लेग प्रतीत होता है। मैंने इस विषय पर कई प्रश्नों को देखा है लेकिन अब तक कोई भी मदद नहीं कर रहा है।

<ion-header> 
    <ion-navbar> 
    <button ion-button icon-only menuToggle> 
     <ion-icon name="menu"></ion-icon> 
    </button> 
    <ion-title> 
     {{pageName}} 
    </ion-title> 
    </ion-navbar> 
</ion-header> 
<ng-content> 
</ng-content> 
<ion-footer> 
    <ion-toolbar> 
    <ion-tabs> 
     <ion-tab [root]="usersPage" tabTitle="Chat" tabIcon="chat"></ion-tab> 
    </ion-tabs> 
    </ion-toolbar> 
</ion-footer> 

और टीएस फ़ाइल की तरह तो दिखता है::

export class AstootLayoutComponent { 

    @Input() pageName: string; 

    usersPage: any = UsersPage; 
    profilePage: any = ProfilePage; 

} 

तो मैं एक उपयोगकर्ता पृष्ठ इस घटक की खपत है

मैं इस घटक लेआउट घटक जो मेरे सभी पृष्ठों लपेटता बना लिया है जो ऐसा लगता है:

<astoot-layout [pageName]="pageName"> 
    <ion-content padding> 
    <page-list-base [detailPageType]="userDetailType" [baseProvider]="baseProvider" [config]="pageListConfiguration"></page-list-base> 
    </ion-content> 
</astoot-layout> 

जब मैं अपना आवेदन शुरू करने का प्रयास करता हूं तो मुझे एक ई प्राप्त होता है rror:

Maximum call stack size exceeded

TypeError: Cannot read property 'getList' of undefined at PageListBaseComponent.set [as baseProvider] (http://localhost:8100/build/main.js:115817:21) at Wrapper_PageListBaseComponent.check_baseProvider (/AppModule/PageListBaseComponent/wrapper.ngfactory.js:38:31) at CompiledTemplate.proxyViewClass.View_UsersPage0.detectChangesInternal (/AppModule/UsersPage/component.ngfactory.js:80:35) at CompiledTemplate.proxyViewClass.AppView.detectChanges (http://localhost:8100/build/main.js:111909:14) at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (http://localhost:8100/build/main.js:112104:44) at CompiledTemplate.proxyViewClass.AppView.internalDetectChanges (http://localhost:8100/build/main.js:111894:18) at CompiledTemplate.proxyViewClass.View_UsersPage_Host0.detectChangesInternal (/AppModule/UsersPage/host.ngfactory.js:29:19) at CompiledTemplate.proxyViewClass.AppView.detectChanges (http://localhost:8100/build/main.js:111909:14) at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (http://localhost:8100/build/main.js:112104:44) at ViewRef_.detectChanges (http://localhost:8100/build/main.js:77367:20) at NavControllerBase._viewAttachToDOM (http://localhost:8100/build/main.js:43575:40) at NavControllerBase._transitionInit (http://localhost:8100/build/main.js:43678:18) at NavControllerBase._postViewInit (http://localhost:8100/build/main.js:43531:14) at NavControllerBase._viewTest (http://localhost:8100/build/main.js:43627:25) at NavControllerBase._nextTrns (http://localhost:8100/build/main.js:43370:25)

कुछ जांच के माध्यम से कारण तथ्य AstootLayoutComponent संदर्भ उपयोगकर्ता पृष्ठ है, जहां यह में रहता हो रहा है कुछ कैसे एक हमेशा के पाश पैदा करता है।।

ऐसा क्यों हो रहा है, प्रलेखन का उल्लेख यह नहीं लगता है कि आप पृष्ठ पर इस घटक के आगे नहीं जा सकते हैं। मैं इसे कैसे ठीक करूं? , तो आप ऐसा

बाउंटी संपादित

मैं एक Repository जो बस एक चेतावनी के रूप में मेरी समस्या

प्रतिकृति के बाद से टैब नियंत्रक एक हमेशा के पाश में है बना लिया है, और एपीआई GitHub की ओर इशारा कर रहा है दर सीमा को मारने से पहले इसे स्विच करना चाहते हैं, आप वातावरण में यूआरएल बदल सकते हैं।

Answer 1

मुझे लगता है कि आपको एक टैब घटक जोड़ने की आवश्यकता है। इसलिए अस्थिर लेआउट में आप जो कुछ भी कर रहे थे, वह इस टैब घटक में स्थानांतरित हो जाता है। मैंने एक पीआर खोला: https://github.com/granthoff1107/Ionic-Sample-Max-Exceed/pull/1

मैंने इसका परीक्षण किया और अब और अधिक स्टैक त्रुटियां नहीं हैं क्योंकि अब आपके पास अस्टूट लेआउट और आयन-टैब के बीच रिकर्सिव रिलेशनशिप नहीं है।

Astoot लेआउट घटक से टैब घटक निकालें:

<ion-header> 
    <ion-navbar> 
    <button ion-button icon-only menuToggle> 
     <ion-icon name="menu"></ion-icon> 
    </button> 
    <ion-title> 
     {{pageName}} 
    </ion-title> 
    </ion-navbar> 
</ion-header> 
<ng-content> 
</ng-content> 

एक अलग टैब घटक बनाएं: एक प्रकार स्क्रिप्ट फ़ाइल कि astoot लेआउट घटक से पृष्ठ हैं, साथ

<ion-tabs> 
    <ion-tab [root]="usersPage" tabTitle="Chat" tabIcon="chat"></ion-tab> 
    <ion-tab [root]="profilePage" tabTitle="Profile" tabIcon="person"></ion-tab> 
</ion-tabs> 

।

import { ProfilePage } from './../profile/profile'; 
import { UsersPage } from './../users/users'; 
import { Component } from '@angular/core'; 

@Component({ 
    templateUrl: 'tabs.html' 
}) 
export class TabsPage { 

    usersPage: any = UsersPage; 
    profilePage: any = ProfilePage; 

    constructor() { 

    } 
} 

अपने नए टैब पेज app.module.ts जोड़ें और सेट अपने rootPage: any = TabsPage; यह अब आपके मास्टर पृष्ठ रूप में कार्य करेगा और अपनी सामग्री आपके विचार में transcluded कर दिया जाएगा।