New angular project how to set home page

Question

I am new to angular

I have created the new project by using this link https://cli.angular.io/

Here the home page is displayed from appcomponent.html

I have created the new page in SRC >> pages >> index.html and index.ts

I import these pages in appcomponent.ts and appmodule.ts

How to set the default home page as index.

this is my app component page

import { Component } from '@angular/core';
import { Http, Headers } from '@angular/http';
import { IndexPage } from '../pages/index';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class MyApp {
  title = 'app';
  rootPage:any = IndexPage;


  constructor(    public http: Http ) {

    }
  }

Answer 1

You have to generate a new Component with ng g c MyComponent. Then add <router-outlet></router-outlet> to your app.component.html file. Finally you have to configure your Router to display this component at your main address (at localhost:4200). Object should look like

const routesConfig: Routes = [
    { path: '',     component: MyComponent}
    ]

Read more about Router and Routing https://angular.io/guide/router

Answer 2

in app-rounting.module.ts

{path: "",  component: DashboardComponent, pathMatch: "full"},