Question

我尝试过不同的解决方案，但我似乎无法让我的班级工作。

他们都没有上课，但如果我手动添加它就可以了。我的console.log永远不会触发，所以我使用的是ng-class吗？

HTML

<div *ngFor="let master of masters; let i = index">
                    <div  class="m-portlet m-portlet--collapsed  m-portlet--head-solid-bg m-portlet--head-sm" ng-class="getMasterTypeClass(master.masterID)" data-portlet="true" id="m_portlet_tools_{{master.masterID}}">

TS

getMasterTypeClass(masterID){

        var returnClass = "";
        if (masterID > 2999 && masterID < 4000) {
            returnClass = "m-portlet--success";
        } else if (masterID > 3999 && masterID < 5000) {
            returnClass = "m-portlet--primary";
        } else if (masterID > 4999 && masterID < 6000) {
            returnClass = "m-portlet--warning";
        } else if (masterID > 100000) {
            returnClass = 'primary';
        } else {
            returnClass = 'primary';
        }
        console.log(returnClass);
        return returnClass;

    }

Answer 1

语法错误，请按照以下方式使用：

[ngClass]="getMasterTypeClass(master.masterID)"

Answer 2

在你的情况下，你真的不需要[ngModule]，因为你只返回一个简单的字符串（除非你想切换类）。您可以直接将其绑定到[class]="getMasterTypeClass(master.masterID)"。 Here's an example

您还可以跳过returnClass中的临时getMasterTypeClass变量，并直接返回每个if / if else（也会显示在示例中）。

编辑：抱歉，您确实需要[ngModule]，因为您在同一元素上有其他类。

ng-class不在ngFor中触发

2 个答案: