CODEWITHSUNDEEP
htmlcssangularjsangularangularjs-directive
FACode
FACode

Reputation: 1061

Angular 2 Global Style - Load only one css file

I have a problem in Angular 2 with loading styles. I load style (css) only once, in index.html, but when I split my page in components everything goes wrong. I noticed that when I create only one component with entire html code everything is fine.

It's necessary to split css code? I don't want to do that.

I put here some file, I hope to understand my problem.

Thanks for helping.

My page when I split the html page in components My page when I split the html page in components

dashboard.html

<div class="body_wrap_t t">
    <div class="main_wrap r">
        <div class="main_wrap_row c">
            <div class="main_wrap_inner_container t">
                <div class="main_wrap_inner_container_row r">

                    <sidebar-wrap></sidebar-wrap>

                    <right-wrap></right-wrap>

                </div><!-- r --><!-- END main_wrap_inner_container_row -->
            </div><!-- t --><!-- END main_wrap_inner_container -->
        </div><!-- c --><!-- END main_wrap_row -->
    </div><!-- r --><!-- END main_wrap -->
    <footer-wrap></footer-wrap>
</div><!-- t --><!-- END body_wrap -->

right-wrap.component.ts (for example)

import { Component } from '@angular/core';

@Component({
  selector: 'right-wrap',
  templateUrl: 'src/app/pages/dashboard/right-wrap/right-wrap.html',
  // styles: [ './content.css' ],
})
export class RightwrapComponent {

}

And dashboard.component.ts where is my base page component

import { Component } from '@angular/core';
import { Http } from '@angular/http';
import { Router } from '@angular/router';

@Component({
  selector: 'dashboard',
  templateUrl: 'src/app/pages/dashboard/dashboard.html',
})
export class DashboardComponent {

}

Upvotes: 0

Views: 2332

Answers (1)

KaFu
KaFu

Reputation: 2324

If you want to use only one file you load it in your index.html of your project. Do not load any other css files in your Components.

But I would always suggest you to split your css in multiple files. It is more legible when you take a look to it in some weeks, months or years. =) Also you faster know where your mistake is or where you have to make changes.

Upvotes: 1

Related Questions