Question

我有以下HTML结构：

<input type="text" [(ngModel)]="styleObj.backgroundColor">
<div [ngStyle]="styleObj">change style of this div</div>

和js / ts：

styleObj = {
  backgroundColor: "black"
}

起初，它似乎按预期工作。 div的bgColor是黑色的，只要我通过输入键入BgColor属性的有效值（例如：“white”），它就会更新。

但问题是当我输入无效值时，ngStyle什么都不做。它不会更新/删除旧值。

示例：当我输入“white”（有效）时，然后更改为“whitee”（无效），背景保持白色。我可以更进一步说“whiteeblablabla”，它不会改变。它只会在我输入BgColor的有效值时改变。

我正在使用Angular 4.0.0。这在Angular 1上没有发生。我猜Angular在实际进行更改以获得更好的性能之前会对属性进行验证。这种行为对某些应用程序有好处，但在我的情况下，我希望用户能够输入自己的值并获得视觉反馈，这没有任何意义。

我是对的吗？有解决方法/解决方案吗？或者我做错了什么？