0

So, I want to structure this project i am working with Angular and Nativescript. The probelem is i cant find any guide for a base flexible and robust architecture. Is it fine to follow the one that angular provides?

Prajil Shrestha
  • 124
  • 1
  • 9
  • Angular is reused in NativeScript, except for some special cases like renderers, page router outlet etc., So, Yes you can follow what Angular gives you. – Manoj Mar 26 '20 at 22:33

1 Answers1

0

Try to add route url for all pages inside the project in app routing page like:-

1. app.routing.module.ts:-

 import { NgModule } from "@angular/core";
 import { Routes } from "@angular/router";
 import { NativeScriptRouterModule } from "nativescript-angular/router";

 const routes: Routes = [
  { path: "", redirectTo: "/login", pathMatch: "full" },
  { path: "home", loadChildren: "~/app/home/home.module#HomeModule" },
  { path: "login", loadChildren: "~/app/login/login.module#LoginModule" },
 ];

 @NgModule({
  imports: [NativeScriptRouterModule.forRoot(routes)],
  exports: [NativeScriptRouterModule]
 })
 export class AppRoutingModule { }

2. home.component.ts

import { Component, OnInit } from "@angular/core";
import { Router } from "@angular/router";
import { Page } from "tns-core-modules/ui/page";

@Component({
  selector: "app-home",
  moduleId: module.id,
  templateUrl: "./home.component.html",
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit{


 constructor(private page: Page, private router: Router) {

 }

 ngOnInit(): void {

 }

 login() {
    this.router.navigate(["/home"]);
 }
}
FrontEnd-er
  • 661
  • 4
  • 13
  • Thanks for the suggestion, also are dynamic imports fine with nativescript? – Prajil Shrestha Mar 27 '20 at 11:47
  • Something like this: `{ path: '', component: BlankLayoutComponent, children: [ { path: 'auth', loadChildren: () => import('./views/auth/auth.module').then(m => m.AuthModule) }, { path: 'onboard', loadChildren: () => import('./views/onboard/onboard.module').then(m => m.OnboardModule) }, ] },` – Prajil Shrestha Mar 27 '20 at 11:48
  • Yes for dynaimc imports you use route param like { path: "home/:pagename", loadChildren: "~/app/home/home.module#HomeModule" }, – FrontEnd-er Mar 27 '20 at 11:53
  • By dynamic import i mean, lazy loading import for modules. `() => import('./views/auth/auth.module').then(m => m.AuthModule)` – Prajil Shrestha Mar 27 '20 at 11:56