Angular additional components to index.html

Question

<!doctype html>
<html lang="en">
    <head>
      <meta charset="utf-8">
      <title>UdemyApp</title>
      <app-settings></app-settings>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <link id="styleUrl" rel="stylesheet" href="https://bootswatch.com/4/superhero/bootstrap.min.css">
      <base href="/">

      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="icon" type="image/x-icon" href="favicon.ico">
    </head>
    <body>

      <app-root>

      </app-root>
    </body>
</html>

I would like for the app-settings component to show. It has some script and links is all.

If that isn't possible, I would like to know how to add another component to the index.html file. Like the following:

<body>
  <app-settings><app-settings> 
  <app-root></app-root>
</body>

Yerkon · Accepted Answer · 2018-04-10 04:08:34Z

2

Add another components to bootstrap array of AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';

/* the AppModule class with the @NgModule decorator */
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent, AppSettings]
})
export class AppModule { }

The bootstrap array

answered Apr 10, 2018 at 4:08

Yerkon

4,8182 gold badges20 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

elciospy Over a year ago

Thannnkkk yyouuuu!!

Omkar Nath Singh · Accepted Answer · 2018-04-10 03:27:03Z

0

You can add as many components as you want into a html page. The way to do ism let your component name is "test-component", then place

<test-component> </test-component>

inside the html file.

As per your question, it should be,

<app-settings></app-settings>

answered Apr 10, 2018 at 3:27

Omkar Nath Singh

3,4042 gold badges17 silver badges36 bronze badges

Collectives™ on Stack Overflow

Angular additional components to index.html

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related