时间戳

首页 > 解决方案 > Angular 风格

angular - Angular 风格

问题描述

我对 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"

哪里有问题？

谢谢你的帮助

在此处输入图像描述

标签： angularng-style

解决方案

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

推荐阅读