角度 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"

问题出在哪里？

感谢您的帮助

enter image description here

Answer 1

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