1

I created an Angular component that is a bottom navbar from bootstrap, I would like to call this component after the body because as it is said here https://getbootstrap.com/docs/3.3/components/#navbar-fixed-top "The fixed navbar will overlay your other content, unless you add padding to the bottom of the body"

My problem is that when i try to call my component in the file index.html it is just ignored : 

<!doctype html>
 <html lang="en">
  <head>
   <meta charset="utf-8">
   <title>Infotel Quotation</title>
   <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>
  <app-bottom-bar></app-bottom-bar>
</html>

I only can call it from app.component.html but if i do that, my component will be in the body

I tried to moved the <body> </body> in the app.component.html file but it doesn't work

My simple app.component.html :

<router-outlet></router-outlet>

Any help would be appreciated

John Snow
  • 77
  • 2
  • 11
  • You don't call Angular components outside of Angular's scope. If you want to achieve what you're trying, you'll have to import bootstrap in your index.html file and put the bootstrap code in there **EDIT** Apparently you can, see the link given by @canpan14 –  Aug 24 '18 at 12:42
  • Along with what @trichetriche said, here is a similar question/answer https://stackoverflow.com/questions/38526221/render-angular-component-outside-the-main-app – canpan14 Aug 24 '18 at 12:42
  • The answer in this question works ? Have you had the chance to try it ? (Didn't know that by the way, thank you for the knowledge !) –  Aug 24 '18 at 12:44
  • Well i am not sure about the duplicated question, i am able to call component inside the body thanks to @canpan14 but it still doesnt work outside the body – John Snow Aug 24 '18 at 13:37
  • I think the real question is why do you need to do that? Is there something wrong with putting that component in the body? – canpan14 Aug 24 '18 at 15:01
  • I created a nav bar that i fixed to the bottom of the page, in one page i have an accordion that is a bit hidden by the navbar when unroll. Solution to this is to add padding to the body, but it's quite useless if the navbar is within the body – John Snow Aug 29 '18 at 07:31

0 Answers0