Angular 4 and bootstrap - Adding container class to component selector

问题

I am currently adding bootstrap's container class to the component selector so all child elements react to bootsrap classes

for example in the index.html file i've applied

<app-root class="container"></app-root>

and in the bootstrapped app.component.html I've applied

<app-header class="row"></app-header>

Not sure if this is the recommended approach?

回答1:

I recomend in app.component put the container class

<div class="container">

       <app-header></app-header>

</div>

and in the component app-header.component

<div class="row">
    ...
</div>

回答2:

i am using angular4 Jquery plugin to add custom classes to components on creation with
jQuery('app-header').addClass('class1 class2 class3')

maybe you can use something like this in ngOnInit() or where it fits you best

Ex:

   import { Component, OnInit} from '@angular/core';
    @Component({
      selector: 'app-header',
      templateUrl: './app-component.html',
      styleUrls: ['./app-component.css']
    })
    export class AppComponent implements OnInit {
      ngOnInit(): void {
        jQuery('app-header').addClass('col-sm-6 example-class');
      }
    }

Then it should look something like this: <app-header class="col-sm-6 example-class"> ...

I do not know if this is the right way but it works for me for now

I hope it helps, Cheers

来源：https://stackoverflow.com/questions/44826815/angular-4-and-bootstrap-adding-container-class-to-component-selector

标签

javascript