css-styleUrls没有加载到angular2 ChildComponent(RC5)中

在我的角度2(RC5)项目中,我有许多组件都可以正常工作,但是,我添加了一个子模块,除了childComponent的styleUrl属性外,它工作正常.如果我在教程中使用相同的url路径(子模块的根组件),则应用样式.如果我向章节(子模块的子组件)添加完全相同的路径,那么样式不会应用？

博客中没有404,chrome的开发工具不会将chapter.css显示为源,或网络上存在的东西.

在这里,您可以看到导致我出现此问题的组件：

@Component({
  selector: 'chapter',template: `<div [innerHTML]="content"></div>`,styleUrls: ['app/tutorial/chapter/chapter.css']
})
export class chapterComponent implements OnInit,OnDestroy {
  private sub: Subscription;
  private content: string = '';

  constructor( private route: ActivatedRoute) {  }

  ngOnInit() {
    this.sub = this.route.params.subscribe(params => {
      var that = this;
      var _url = './chapter/' + params['id'] + '.html';
      $.ajax({
        url: _url,success: function (result) {
          that.content = result;
        }
      });
    });
  }
}

chapter.css没有被选中……你可以在这里看到我的项目文件：

|-- error.html',|-- index.html',|-- app',|-- app.component.ts',|-- app.module.ts',|-- app.routes.ts',|-- main.ts',|-- home',|   |-- home.component.ts',|   |-- home.css',|   |-- home.html',|-- tutorial',|-- tutorial.component.ts',|-- tutorial.css',|-- tutorial.html',|-- tutorial.module.ts',|-- tutorial.routes.ts',|-- chapter',|-- chapter.component.ts',|-- chapter.css',|-- chapter.html',

为什么只有这个组件不起作用…我能看到的唯一区别是这个组件是一个子组件,所以也许这有所不同？

更新：

正如对答案的评论中所述,使用路径./app/tutorial/chapter/chapter.css可以在教程组件中使用,但完全相同的路径在章节组件(子组件)中不起作用.我还添加了ViewEncapsulation,但它不起作用……

解决方法

尝试将“encapsulation：ViewEncapsulation.None”添加到父组件

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

   @Component({
       encapsulation: ViewEncapsulation.None
     })

原文地址：https://www.jb51.cc/css/215328.html