NgStyle 返回：ERROR 错误：找不到不同的支持对象 '{"background-color":"blue"}'答案

【问题标题】：NgStyle returns: ERROR Error: Cannot find a differ supporting object '{"background-color":"blue"}'NgStyle 返回：ERROR 错误：找不到不同的支持对象 '{"background-color":"blue"}'
【发布时间】：2017-09-08 23:45:02
【问题描述】：

在我的模板中使用这个，

<span [ngStyle]="myStyle()"> HELLO </span>

这在我的组件中，

myStyle(): string {
  return '{"background-color":"blue"}'
}

我来了

ERROR Error: Cannot find a differ supporting object '{"background-color":"blue"}'
    at KeyValueDiffers.webpackJsonp.../../../core/@angular/core.es5.js.KeyValueDiffers.find (core.es5.js:8051)
    at NgStyle.set [as ngStyle] (common.es5.js:2441)
    at updateProp (core.es5.js:11114)
    at checkAndUpdateDirectiveInline (core.es5.js:10806)
    at checkAndUpdateNodeInline (core.es5.js:12349)
    at checkAndUpdateNode (core.es5.js:12288)
    at debugCheckAndUpdateNode (core.es5.js:13149)
    at debugCheckDirectivesFn (core.es5.js:13090)
    at Object.View_AppComponent_2.currVal_2 [as updateDirectives] (AppComponent.html:10)
    at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13075)
View_AppComponent_2 @ AppComponent.html:10
webpackJsonp.../../../core/@angular/core.es5.js.DebugContext_.logError @ core.es5.js:13415

【问题讨论】：

标签： angular templates

【解决方案1】：

原因是[ngStyle] 不接受字符串。它接受一个对象。试试这个吧，

myStyle(): object {
  return {"background-color":"blue"};
}

【讨论】：

这似乎是一个“错字”问题。为什么你认为它作为一个自我回答的问题很有用？你经常看到这个错误吗？
错字与否，这是任何人都会犯的错误。
@CodyGray 我不认为这是一个错字，但从某种角度来看，我想所有的错误都是。我打算传递一个字符串。我真蠢。这不是它所期望的。我根本没有发现错误直观。我希望它可以帮助其他人。
我在 [ngStyle] 周围缺少方括号。仍然有帮助
@EvanCarroll 如果我想要一个过滤器样式，如 -> {filter: blur(5px);}