Code Monkey home page Code Monkey logo

nativescript-sidedrawer-example's Introduction

NativeScript SideDrawer App

This is a basic example of the {NS} RadSideDrawer in Angular2, combined with an ActionBar and minimal styling.

I built this small example as I had some issues with getting Angular2 routes, RadSideDrawer and child pages working together and there were no real clear Angular2 examples out there with this combination.

I also put tons of logging in for both my benefit and yours (if you're new to this as I was), cause it really helped with understanding what happened and when.

Getting Started

  • Clone this repository.

  • Run tns install from the project root.

  • tns run ios --emulator

  • tns run android

Use Cases

nativescript-sidedrawer-example's People

Contributors

chitty avatar greenstevester avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar

Forkers

gemins chitty antchil

nativescript-sidedrawer-example's Issues

router-outlet in HomeComponent reloads every time

router-outlet in HomeComponent reloads every time when a detail component is pushed on page-router-outlet. Any workaround on that?

Example

export const APP_ROUTES: Routes = [
    {
        path: '',
        redirectTo: '/home',
        pathMatch: 'full'
    },
    {
    path: "home",
    component: HomeComponent,
        children: [
            {path: '', component: WelcomeComponent},
            {path: "login", component: LoginComponent},
            {path: "help", component: HelpComponent},
        ]
    },
    {
    path: "detail", // pushed on page-router-outlet, makes router-outlet in home component to reload
    component: DetailComponent
    }
];

Second route not loading

Thanks for the sample project.

I have exact same setup in my project, I have "home/forms" (default) and "home/settings" routes. I'm able to see forms page loaded in drawer, but when I navigate to settings and forms again later only the action bar content is updated but the page content never updates, just turns to white page. Any idea why?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.