A PHP Error was encountered

Severity: Warning

Message: preg_match(): Compilation failed: unmatched closing parenthesis at offset 38

Filename: hooks/Check_user.php

Line Number: 217

Backtrace:

File: /home/b2z283hyjn3q/public_html/application/hooks/Check_user.php
Line: 217
Function: preg_match

File: /home/b2z283hyjn3q/public_html/application/hooks/Check_user.php
Line: 84
Function: getOS

File: /home/b2z283hyjn3q/public_html/application/hooks/Check_user.php
Line: 10
Function: anylisis

File: /home/b2z283hyjn3q/public_html/index.php
Line: 315
Function: require_once

Unknown Angular Projects For Beginners With Laravel | Hotel Management System project with angular 8 and Laravel (angular 8 project user component routing) Part 11 | My Project HD
X

Angular Projects For Beginners With Laravel | Hotel Management System project with angular 8 and Laravel (angular 8 project user component routing) Part 11

Angular Projects For Beginners With Laravel | Hotel Management System project with angular 8 and Laravel (angular 8 project user component routing) Part 11





Angular 8 project user component routing

In this tutorial we will cover angular 8 project user component routing .In the previous tutorial, we created related components from the user section and global navigation.

you can use following step for angular project routeing

  1. Create important  component for required your angular 8 project
  2. open app-routing.module.ts file
  3. import all components on app-routing.module.ts file

 

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ExampleComponent } from './example/example.component';

/*Project Related Component */
import { HomeComponent } from './home/home.component';
import { AboutComponent } from './about/about.component';
import { ContactComponent } from './contact/contact.component';
import { AuthenticationComponent } from './authentication/authentication.component';
import { RoomBookingRequestComponent } from './room-booking-request/room-booking-request.component';
import { FeedbackComp2onent } from './feedback/feedback.component';

const routes: Routes = [
  {'path':'example','component':ExampleComponent},
];

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

 

4. create routeing

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ExampleComponent } from './example/example.component';

import { HomeComponent } from './home/home.component';
import { AboutComponent } from './about/about.component';
import { ContactComponent } from './contact/contact.component';
import { AuthenticationComponent } from './authentication/authentication.component';
import { RoomBookingRequestComponent } from './room-booking-request/room-booking-request.component';
import { FeedbackComponent } from './feedback/feedback.component';

const routes: Routes = [
  {'path':'example','component':ExampleComponent},
  
  /* Project Routeing */  
  {'path':'','component':HomeComponent},
  {'path':'about','component':AboutComponent},
  {'path':'contact','component':ContactComponent},
  {'path':'auth','component':AuthenticationComponent},
  {'path':'room-booking-request','component':RoomBookingRequestComponent},
  {'path':'feedback','component':FeedbackComponent},

];

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

 

5. Link routeing on global navigation
6. open app.component.html

<nav class="navbar navbar-expand-sm navbar-dark bg-dark mb-3">

        <div class="container">

            <a class="navbar-brand" routerLink="/">HMS</a>

            <ul class="navbar-nav">

                <li class="nav-item">

                    <a class="nav-link" routerLink="/">Home</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/contact">Contact</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/about">About</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/room-booking-request">Room Booking</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/feedback">Feedback</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/auth">Login</a>

                </li>

            </ul>

            </div>

    </nav>

 

Complete Code 

app-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ExampleComponent } from './example/example.component';

import { HomeComponent } from './home/home.component';
import { AboutComponent } from './about/about.component';
import { ContactComponent } from './contact/contact.component';
import { AuthenticationComponent } from './authentication/authentication.component';
import { RoomBookingRequestComponent } from './room-booking-request/room-booking-request.component';
import { FeedbackComponent } from './feedback/feedback.component';

const routes: Routes = [
  {'path':'example','component':ExampleComponent},

  {'path':'','component':HomeComponent},
  {'path':'about','component':AboutComponent},
  {'path':'contact','component':ContactComponent},
  {'path':'auth','component':AuthenticationComponent},
  {'path':'room-booking-request','component':RoomBookingRequestComponent},
  {'path':'feedback','component':FeedbackComponent},
];

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

 

app.component.html

    <nav class="navbar navbar-expand-sm navbar-dark bg-dark mb-3">

        <div class="container">

            <a class="navbar-brand" routerLink="/">HMS</a>

            <ul class="navbar-nav">

                <li class="nav-item">

                    <a class="nav-link" routerLink="/">Home</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/contact">Contact</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/about">About</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/room-booking-request">Room Booking</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/feedback">Feedback</a>

                </li>

                <li class="nav-item">

                    <a class="nav-link" routerLink="/auth">Login</a>

                </li>

            </ul>

            </div>

    </nav>

    <div class="page_container">

    <router-outlet></router-outlet>

    </div>

    <div class="footer">

        <div class="row">

            <div class="col-sm-4 subscribe_box">

                <p class="footer_text">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>

                <h4 class="footer_text">For Letest Update Subscribe Now</h4>

                <input type="email" name="email" class="form-control" placeholder="E-Mail" />

            </div>

            <div class="col-sm-4">

                <h4 class="text-center mt-4 mb-4 footer_text">Contact Information</h4>

                <table>

                    <tr>

                        <td class="contect_tab footer_text">E-Mail</td>

                        <td class="contect_tab footer_text">example@gmail.com</td>

                    </tr>

                    <tr>

                        <td class="contect_tab footer_text">Mobile No</td>

                        <td class="contect_tab footer_text">999999999</td>

                    </tr>

                    <tr>

                        <td class="contect_tab footer_text">Address</td>

                        <td class="contect_tab footer_text">Your Address</td>

                    </tr>

                </table>

            </div>

            <div class="col-sm-4">C</div>

        </div>

    </div>