Angular 中的枚举数组

Question

如何在 Angular 中显示枚举数组？

我有一个带有枚举数组属性的对象，我想在 html 组件中显示：

<ul  class="list-group list-group-flush">
         <li *ngFor="let prop of object.characteristics" class="list-group-item">
                     {{ prop }}
         </li>
</ul>

我的特征值为=[冷静、社交、恐惧、保护、友善]

我尝试过对象？.特征， 如果我使用 {{object.characteristics}}，那么它会起作用：平静，社交，恐惧，保护，友好

但我想使用 *ngFor 属性

Answer 1

为了更清楚起见，您能否分享一下您如何定义枚举数组？ 这似乎对我有用：

import { Component } from '@angular/core';

export enum Characteristic {
    Calm = 'Calm',
    Social = 'Social',
    Fearful = 'Fearful',
    Protective = 'Protective',
    Friendly = 'Friendly',
}

@Component({
    selector: 'app-sample-component',
    template: `
        <ul class="list-group list-group-flush">
            <li *ngFor="let prop of object.characteristics" class="list-group-item">
                {{ prop }}
            </li>
        </ul>
    `,
})

export class SampleComponent {
    object = {
        characteristics: [
            Characteristic.Calm,
            Characteristic.Social,
            Characteristic.Fearful,
            Characteristic.Protective,
            Characteristic.Friendly,
        ],
    };
}