jinalshah999

import { Injectable } from '@angular/core';
import { User } from './user.interface';
import { Router } from '@angular/router';
import { Observable, Subject } from 'rxjs/Rx';
declare var firebase: any;
@Injectable()
export class UserAuthService {

  constructor(private router: Router) { }
  signupUser(user: User) {

jinalshah999

export interface User{
    email:string;
    password:string;
    confirmpassword:string;
}

jinalshah999

<header>
    <nav class="navbar navbar-default">
        <div class="container-fluid">

            <ul class="nav navbar-nav">

                <li><a routerLink="/signup">Sign Up</a></li>
                <li><a routerLink="/signin">Sign In</a></li>
                <li><a routerLink="/userProfile">ViewProfile</a></li>

jinalshah999

import { Component, OnInit } from '@angular/core';
import { UserAuthService } from './user-auth.service';
@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.css']
})
export class HeaderComponent implements OnInit {

  constructor(private userauthService:UserAuthService) { }

jinalshah999

import { RouterModule, Routes } from "@angular/router";
import { SignupComponent } from './users/signup.component';
import { UsersComponent } from './users/users.component';
import { SigninComponent } from './users/signin.component';
import { UserAuthGuardService } from './user-auth-guard.service';
const APP_ROUTES: Routes = [
    {path: '', redirectTo: '/signup', pathMatch: 'full'},
    {path: 'signup', component: SignupComponent},
    {path: 'userProfile', component: UsersComponent ,canActivate:[UserAuthGuardService] },
    {path: 'signin', component: SigninComponent}

jinalshah999

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { Observable } from 'rxjs/Rx';
import { UserAuthService } from './user-auth.service';

@Injectable()
export class UserAuthGuardService {

  constructor(private _data: UserAuthService) { }
  

jinalshah999

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { UserAuthService } from '../user-auth.service';
@Component({
  selector: 'app-signin',
  templateUrl: './signin.component.html',
  styleUrls: ['./signin.component.css']
})
export class SigninComponent implements OnInit {

jinalshah999

<h1>Sign In</h1>
<form [formGroup]="myForm" (ngSubmit)="onSignin()">
  <div class="form-group">
    <label for="email">E-Mail</label>
    <input formControlName="email" type="email" id="email" class="form-control">
  </div>
  <div class="input-group">
    <label for="password">Password</label>
    <input formControlName="password" type="password" id="password" class="form-control">
  </div>

jinalshah999

<form [formGroup]="myForm" (ngSubmit)="onSignup()">
  <div class="form-group">
    <label for="email">E-Mail</label>
    <input formControlName="email" type="email" id="email" #email class="form-control">
    <span *ngIf="!email.pristine && email.errors != null && email.errors['noEmail']">Invalid mail address</span>
  </div>
  <div class="form-group">
    <label for="password">Password</label>
    <input formControlName="password" type="password" id="password" class="form-control">
  </div>

jinalshah999

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators, FormControl } from "@angular/forms";
import { UserAuthService } from '../user-auth.service';
@Component({
  selector: 'app-signup',
  templateUrl: './signup.component.html',
  styleUrls: ['./signup.component.css']
})
export class SignupComponent implements OnInit {
 myForm: FormGroup;