<router-outlet>可以正常工作，但会引起问题<page-router-outlet>

Question

我正在创建NativeScript-Angular应用。我在应用程序内部路由时遇到问题，无法使用后退按钮（智能手机中的后退按钮，应该返回上一页，但它正在关闭我的应用程序）。

我在app.component.html文件中使用了它，因此我将其更改为，后退按钮开始像预期的那样工作，但是我的主页的布局被完全破坏了-所有对象彼此重叠，并且“预览” ActionBar出现在其中之一。

<!-- app.component.html -->

<GridLayout class="page">
    <ScrollView>
    <GridLayout rows="80 *" columns="*">
        <FlexboxLayout class="menu">      
<Image class="menu" src="~/app/images/burger.png" width="10%"></Image>
          </FlexboxLayout>
          <ScrollView></ScrollView>
            <GridLayout class="bialy" row="1" rows="*" columns="*">
              <FlexboxLayout>
                  <GridLayout class="space"></GridLayout>
                  <page-router-outlet></page-router-outlet>
                </FlexboxLayout>
            </GridLayout>
          </GridLayout> 
        </ScrollView>
</GridLayout>

<!-- app.css -->

GridLayout.page {
    background: linear-gradient(-85deg, #08BD73, #02A373);
    flex-direction: column;
}
GridLayout.bialy {
    background: white;
    flex-direction: column;
    border-radius: 40 40 0 0;
    justify-content: center;
}

<!-- home.component.html -->
<Button text="Add" [nsRouterLink]="['/new']"></Button>
<Button text="Watering" [nsRouterLink]="['/watering']"></Button>
<Button text="catalog" [nsRouterLink]="['/catalog']" ></Button>

我应该怎么做才能使我的应用与具有

的应用版本相同

这是版本的外观（屏幕1）： 这就是版本的外观（我希望我的应用看起来像这样）（屏幕2）

Answer 1

在#include <iostream> #include <SDL.h> using namespace std; int main( int argc, char * argv[] ) { SDL_Init(SDL_INIT_EVERYTHING); SDL_Window *janela = NULL; SDL_Renderer *renderer = NULL; bool roda = true; SDL_Event evento; int x; int y; int x2; int y2; janela = SDL_CreateWindow( "janela" , SDL_WINDOWPOS_CENTERED , SDL_WINDOWPOS_CENTERED ,500 , 500 , SDL_WINDOW_RESIZABLE); renderer = SDL_CreateRenderer(janela , -1 , SDL_RENDERER_ACCELERATED); while (roda) { SDL_Event evento; while (SDL_PollEvent(&evento)) { switch(evento.type){ case SDL_QUIT: roda = false; break; case SDL_MOUSEBUTTONDOWN:{ x = evento.motion.x; y = evento.motion.y; break;} case SDL_MOUSEBUTTONUP: while(roda){ x2 = evento.motion.x; y2 = evento.motion.y; SDL_SetRenderDrawColor(renderer , 255 , 0 , 0 , 255); SDL_SetRenderDrawColor(renderer , 125 , 234 , 253 , 255); SDL_RenderDrawLine(renderer , x , y , x2 , y2); SDL_RenderPresent(renderer); break;} case SDL_KEYDOWN:{ switch(evento.key.keysym.sym){ case SDLK_b:{ SDL_RenderClear(renderer); } } } } } } SDL_DestroyWindow(janela); janela = NULL; SDL_DestroyRenderer(renderer); renderer = NULL; SDL_Quit(); return 1; } 上将actionBarVisibility设置为never以隐藏操作栏。

您的home组件似乎没有任何布局，这可能是您仅看到最后一个按钮的原因，请用page-router-outlet包裹它们。