Question

我使用nativescript中的RadSideDrawer指令创建了侧边菜单，当我尝试在其中加载子路径时，除了默认加载外，所有后续加载都会显示一个空白屏幕。

这就是我加载内容的方式。

<ScrollView tkMainContent class="menu-content">
    <router-outlet></router-outlet>
</ScrollView>

导航逻辑：

<StackLayout>

        <StackLayout orientation="horizontal" [nsRouterLink]="['./']" class="menu-item" 
                [nsRouterLinkActiveOptions]="{exact: true}" nsRouterLinkActive="active" horizontalAlignment="left">
             <Label text="{{inspectionsIcon}}" class="icon" ></Label>   
             <Label text="Reports"></Label>   
        </StackLayout>

        <StackLayout orientation="horizontal" [nsRouterLink]="['properties']"  class="menu-item" nsRouterLinkActive="active" horizontalAlignment="left">
            <Label text="{{propertiesIcon}}"  class="icon" ></Label>
             <Label text="Properties" ></Label>   
        </StackLayout>

        <StackLayout orientation="horizontal" [nsRouterLink]="['settings']" class="menu-item" nsRouterLinkActive="active" horizontalAlignment="left">
            <Label text="{{settingsIcon}}"  class="icon" ></Label>
             <Label text="Settings"></Label>   
        </StackLayout>



    </StackLayout>

因此，当父路由加载时，我会看到默认子路径的内容。当我切换到任何其他子路线时，我看到一个空白屏幕。任何帮助解决这个问题将不胜感激。

我知道导航逻辑很好，因为当我只注释RadSideDrawer并将其用作列表视图时它会正常加载

Answer 1

我遇到了同样的问题，并且由于RadSideDrawer与默认的家庭路由器路径位于同一组件模板中而导致循环引用，在您的情况下[nsRouterLink]="['./']

在我的情况下，当我将console.log添加到包含我的RadSideDrawer的HomeComponent的构造函数时，我看到构造函数和我在里面的标签一样被触发了两次：

<ScrollView tkMainContent class="menu-content"＆GT;

解决方案（Telerik建议我）将默认路由指向另一个“登陆页面”，如[nsRouterLink] =“['welcomPage']，从而删除循环引用。

NativeScript侧抽屉无法加载路由器插座

1 个答案: