在嵌套组件中找不到Angular 5 css

Question

我在admin-dashboard组件中创建了一个嵌套组件（名为 - demotask）。我还为此创建了所需的.ts和.html文件。嵌套组件出现在正确的位置，但css不适用于此嵌套组件。所有样式/ css都通过angular-cli.json文件附加到项目中。我在demotask.component.ts文件中使用了以下代码，但是没有任何反应。

import {Component, OnInit, ViewEncapsulation} from '@angular/core';
@Component({
  selector: 'app-demotask',
  templateUrl: './demotask.component.html',
  styleUrls: [],
  encapsulation: ViewEncapsulation.None
})

现在看起来像下面的屏幕截图：

它应如下所示：

Answer 1

您可以使用styleURL属性在组件中添加多个样式。

由于app component是main component，您可以在那里添加多个样式。

以下是它的外观：

import {Component} from "angular2/core";

@Component({
    selector: "my-app",
    styleUrls: ["styles1.css", "styles2.css"],
    template: `
<StackLayout orientation="vertical">
    <Label [text]="message" class="title" (tap)="message = 'OHAI'"></Label>
</StackLayout>
`,
})
export class AppComponent {
    public message: string = "Hello, Angular!";
}