组件正在路由器出口外加载

Question

app.component.html

<div class="row">
   <app-aside class="col-lg-3 col-md-12 px-2"></app-aside>
   <router-outlet class="col-lg-9 col-md-12 px-2"></router-outlet> 
</div>

outoput

<app-aside class="col-lg-3 col-md-12 px-2"></app-aside>
<router-outlet class="col-lg-9 col-md-12 px-2"></router-outlet> 
<app-dashboard></app-dashboard>

i am trying to load component inside router-outlet. but its not happening. New in angular so have less knowledge about deep level difficulties.

Answer 1

Angular use this html, It should look like this:

<router-outlet></router-outlet> 

You need to remove the class and not use this as an html element, what you can do with it specified here .

More about this you can read in this question .

Answer 2

hey try this,

   <div class="row">
      <div class="col-lg-3 col-md-12 px-2">
        <app-aside></app-aside>
      </div>
      <div class="col-lg-9 col-md-12 px-2">
        <router-outlet></router-outlet>
      </div>
   </div>

Make sure that you have responsive content for the router-outlet.