javascript - 如何将类名添加到 Angular2 指令中

Question

我希望向 NG2 指令添加一个类名，以便对其应用 CSS 规则。给定以下组件:

@Component({
  moduleId: module.id,
  selector: 'search-form',
  templateUrl: 'search-form.component.html',
  styleUrls: [ 'search-form.component.css']
})

我尝试过这个:

search-form {
  width:100%;
  display:block;
}

但是没有成功。

如何将类添加到 search-form ？

Answer 1

@Component({ // or @Directive({
  // use `host:` or `@HostBinding()` (not both)
  // host: {'[class.someclass]': 'true'}
})
class SearchFormComponent {
  @HostBinding('class.someclass')
  someClass = true;
}

也许您的意思是通过将此 CSS 添加到 search-form.component.css

来向“self”添加样式

:host {
  width:100%;
  display:block;
}