Блог

Главная - Вопросы по программированию - Есть ли какой-нибудь способ создать SideDrawer в одном компоненте и использовать его в нескольких шагах (компонентах) в nativescript?

Есть ли какой-нибудь способ создать SideDrawer в одном компоненте и использовать его в нескольких шагах (компонентах) в nativescript?

#nativescript-angular

#nativescript-angular

Вопрос:

Я разрабатываю приложение с использованием NativeScript. Я хочу использовать RadSideDrawer. Что бы я ни понял из nativescript.org заключается в том, что я должен написать один и тот же фрагмент кода в каждом компоненте, где я хочу отобразить ящик. Это хорошая практика? Или есть какой-либо другой способ сделать это?

Комментарии:

1. какой проект NativeScript вы использовали? (Angular, typescript или ..)

2. @miladfm Angular

Ответ №1:

1- Вы можете использовать компонент с проекцией содержимого для отображения динамического содержимого. 2- Вы можете использовать маршрутизацию с page-router-outlet

Первое решение:

mySideDrawer.component.html

 <StackLayout tkMainContent>
    <ng-content></ng-content>
</StackLayout>

Home.component.ts

 <GridLayout rows="*" height="1500px">
    <MySideDrawer #mySideDrawer>
        <Label fontSize="20" text="Component 1"></Label>
            <Button text="OPEN" (tap)="onOpen()"></Button>
            <Button text="Go to component 2" [nsRouterLink]="['/home/comp2']"></Button>
    </MySideDrawer>
</GridLayout>

полная демонстрация:
https://play.nativescript.org/?template=play-ngamp;id=YmqaP3

Второе решение:

 <RadSideDrawer>
    <StackLayout tkDrawerContent backgroundColor="gray">
       <!-- Side bar content -->
    </StackLayout>

    <StackLayout tkMainContent>
        <page-router-outlet></page-router-outlet>
    </StackLayout>

</RadSideDrawer>
Метки: