Angular 4 枚举未在列表中更新

Question

我从 API 加载的列表 (*ngFor) 中有一个字段 (item.state)，在方法中处理并以这种方式显示在屏幕上：

<div class="posts col-md-12" *ngFor="let item of objectives.results" (click)="openItem(modalObjective, item)">
        <div class="row">
            <h4 class="col-md-11">{{item.title}}</h4>
        </div>
        <div class="row">
            <span class="col-md-2">{{item.description}}</span>
            <span class="col-md-3">{{item.ownerPersonName}}</span>
            <span class="col-md-3">{{setStateEnum(item.state)}}</span>
            <div class="progress col-md-4">
                <span class="col-md-2">{{item.state}}%</span>
                <div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%">
                    <span class="sr-only">70% Complete</span>
                </div>
            </div>
        </div>
    </div>

单击某个项目时，我会显示一个包含该项目详细信息的模式。在此模式中，我可以通过 "select html component" 更改此项的 "state"。没关系，但是，当我更改状态并关闭模式时，该项目的状态已更新，但这次是一个数字。属性没有再次进入方法 "setStateEnum"，这只是显示从 API 返回的值（整数）。每次更新状态时，如何将属性再次传递给 "setStateEnum" 方法以显示字符串值？

TS 中的 setStateEnum 方法：

rivate setStateEnum(state: any) {
    switch (state) {
        case 0:
            return "Waiting";
        case 1:
            return "Running";
        case 2:
            return "Finished";
        case 3:
            return "Approved";
        default:
            return state;
    }
}

谢谢！

更新

我只需要向我的 switch case 添加一个 parseInt 就可以了！！就像masterfloda说的。问题是：属性正在通过方法 "setStateEnum" 并转到 "default"，因为该方法正在接收来自更新的字符串！

像这样：

private setStateEnum(state: any) {
    switch (parseInt(state)) {
        case 0:
            return "Waiting";
        case 1:
            return "Running";
        case 2:
            return "Finished";
        case 3:
            return "Approved";
        default:
            return state;
    }
}

Answer 1

我的猜测是，在您更改 state 之后，它是一个字符串，而不是整数，这就是切换到 default: 的原因。而且您不会收到错误，因为该方法接受 any 参数类型。

尝试检查 switch(parseInt(state)):

尽管更简洁的方法是将整数传递给方法并将参数声明更改为 state: number，因为这样您将收到有关格式错误的输入参数的通知。

Angular 4 枚举未在列表中更新

Angular 4 Enum doesn't update in list

enums

ngfor

angular