Angular ngStyle

Question

我对 ngStyle 有问题，我根据悬停变量放置样式。 它有效，但我一直看到警告

Type {color: string, background: string, 'border-color': string} | string is not assignable to type {[p: string]: string} 

我的功能

getSuccessBtnStyleHover() {
        if (this.data && this.data.btnSBorderHColor && this.data.btnSBackgroundHColor && this.data.btnSTextHColor) {
            return {
                'color': this.data.btnSTextHColor,
                'background': this.data.btnSBackgroundHColor,
                'border-color': this.data.btnSBorderHColor,
            };
        }
        return '';
    }

我试过

[ngStyle]="(hovered && themeService.getSuccessBtnStyleHover()) || (!hovered && themeService.getSuccessBtnStyle())"
                       (mouseover)="hovered = true"
                       (mouseout)="hovered = false"

和

[ngStyle]="hovered ? themeService.getSuccessBtnStyleHover() : themeService.getSuccessBtnStyle()"
                       (mouseover)="hovered = true"
                       (mouseout)="hovered = false"

问题出在哪儿？

谢谢你的帮助

在此处输入图片说明

Answer 1

您将返回一个空字符串作为默认条件。 所以返回类型要么是你的 CSS 对象，要么是一个空字符串。 尝试返回{}而不是''