相关疑难解决方法(0)

我正在使用Angular 2和D3.js. 我想要显示一个红色矩形.

它只适用于我在style.css文件中放置样式.检查这个plunkr

当我将我的样式放在组件中时styles: [],它不起作用.检查这个plunkr

使用组件时如何让它工作styles: []？谢谢

更新: @micronyks提供了一个解决方案,但它使组件中的样式全局化,与style.css文件中的写入基本没有区别.在这个plunkr中,它显示一个组件中的样式将覆盖另一个组件的样式,因此无法显示绿色和红色矩形.

更新2: @Günter的方式完美解决了这个问题!只是提醒一下,对于Günter的方式:它至少需要Angular beta 10.(我的其他插件使用Angular beta 8)使用Angular beta 12的绿色和一个红色矩形的工作演示就在这里.

import {Component} from 'angular2/core'
@Component({
  selector: 'my-app',
  providers: [],
   styles: [`
    /*this does not work*/
    .bar {
      fill: red;
    }
  `],
  template: `
    <div>
      <svg class="chart"></svg>
    </div>
  `,
  directives: []
})
export class App {
  constructor() {}

  ngOnInit() {
    this.draw();
  }

  draw() {
    let data = [{name: 'A', …