1

I am having some issues in CSS/Bootstrap work when it is rendered in a angular2 component.

when I try to render the CSS/html contents in Index.html file (with proper references for CSS,JS) the application/functionality works fine. But when the same html contents along with CSS classes is rendered in the angular2 component, it doesn't work.

Based on the searches on internet I have done all these changes but nothing makes it working. I have added encapsulation: ViewEncapsulation.None for that component, still the CSS functionality doesn't work along with angular 2.

also the order of JS references file are placed in the following order

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

I have replicated the issue and checked into Github url

can somebody help me with this issue?

Krishnan
  • 958
  • 5
  • 21
  • 44
  • css will work automatically, with out any additional configuration. You just add the ref link on the index.html If you need to include jsyou may go though my answer. – Aswin KV Oct 01 '16 at 19:32

1 Answers1

2

This is because we cant simply add js files in angular 2 by adding the ref link, try this stack over flow solution

How to use jQuery with Angular2?

For Bootstrap you can use ng-bootstrap https://www.npmjs.com/package/ng2-bootstrap

Community
  • 1
  • 1
Aswin KV
  • 1,710
  • 2
  • 12
  • 23