假设我有一个有两个视图的 Angular 应用程序。第一个视图显示某个对象的预览，比如一辆车，另一个视图显示该车的详细信息。汽车模型类似于：

export class Car {
    model: string;
    type: CarTypeEnum;
    ...;
}

假设我希望两个视图都向我显示一个代表汽车类型的图标。逻辑是：

switch(someCar.type) {
    case CarTypeEnum.HATCHBACK: return icons.hotHatch;
    case CarTypeEnum.SEDAN: return icons.sedan;
    case CarTypeEnum.SUV: return icons.suv;
    case CarTypeEnum.COUPE: return icons.coupe;
    case CarTypeEnum.VAN: return icons.van;
    case CarTypeEnum.WAGON: return icons.wagon;
}

这个根据汽车类型获取图标的逻辑应该去哪里？

• 我应该在汽车模型类中创建一个属性吗？

export class Car {
    model: string;
    type: CarTypeEnum;
    ...;

    get typeIcon() { 
        // switch goes here
    }
}

这感觉有点对，因为我在两个单独的视图中使用它，但我也觉得我在污染模型。

• 我应该将此代码添加到方法中并将其复制到两个视图组件类中吗？如果我必须在 10 个视图中使用此代码，我会在它们各自的组件中重复此逻辑 10 次吗？

• 我是否应该创建一些包含具有此逻辑的方法的静态辅助类，将汽车作为参数，然后在每个组件类中调用它？

• 我应该将逻辑直接添加到视图中吗？

 ... 
 ... 
...

• 是否应该生成一个将汽车类型作为输入的 Angular 组件？这将是可重用的，但只是为了渲染这个图标有点过头了，不是吗？