如何使用带插值的Angular 2创建真正动态且灵活的样式表？

Question

对于角度1的应用程序，我发现有必要添加主题功能，用户可以在应用程序的首选项部分设置几种颜色，应用程序将始终如一地应用这些颜色 - 按钮，进度条 - 您可以命名它

使用Angular 2，这看起来相当困难。例如，如果我需要为奇怪的css选择器提供颜色 - 比如改变进度条上的颜色 - 那么ngStyle，ngClass或指令就无法满足要求。我真正需要的是使用Angular的插值动态创建样式表。

我可以在Angular 1中做到这一点 - 我可以创建一个指令，HTML模板只是一个style element，包含所有的颜色覆盖。这很简单。但Angular 2并不想合作。

MyFile.ts:19:12: Unknown word  17 | 
  18 | :host ul li button {
> 19 |   color: {{themeColors.primaryBackground | async}};
     |            ^
  20 |   border: none;
  21 |   border-radius: 25px;

虽然下面的代码运行得很好，但这不是我想要的，因为它不会在更复杂的情况下工作：

[ngStyle]="{backgroundColor: themeColors.primaryBackground | async}"

如何创建一个动态样式表，允许我在没有Angular 2抱怨的情况下插值（比如使用异步管道等）？