‹router-outlet› работает нормально, но вызывает проблемы ‹page-router-outlet›

экран 1 экран 2

Я создаю приложение NativeScript - Angular. У меня была проблема с маршрутизацией внутри моего приложения с неработающей кнопкой «Назад» (кнопка «Назад» в моем смартфоне должна возвращаться на предыдущую страницу, но она отключает мое приложение).

Я использовал в своем файле app.component.html, поэтому я изменил его на и кнопки «Назад» начали работать так, как предполагалось, но макет моей домашней страницы полностью разрушен — все объекты перекрывают друг друга, а панель действий «Предварительный просмотр» появляется в один из .

<!-- 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)


nativescript nativescript-angular
person Ewa    schedule 12.05.2019    source источник
comment
Кнопка «Назад» выключала ваше приложение? Это больше похоже на крушение. Можете ли вы показать несколько скриншотов того, что вы ожидаете и что видите?   -  person Manoj    schedule 12.05.2019
comment
Я отредактировал свой пост и добавил скриншоты. Я думаю, это не сбой, когда я нажимаю кнопку «Назад», приложение закрывается на главный экран телефона и открывается в фоновом режиме.   -  person Ewa    schedule 12.05.2019

Ответы (1)


arrow_upward
1
arrow_downward

Установите actionBarVisibility на never на page-router-outlet, чтобы скрыть панель действий.

Ваш домашний компонент, похоже, не имеет макета, что может быть причиной того, что вы видите только последнюю кнопку, оберните их StackLayout.

person Manoj    schedule 12.05.2019