Angular. Enum values in template

Angular не позволяет напрямую использовать перечислимый тип (Enum) в шаблонах. Необходимо создавать свойство, которому присваивать выбранный Enum и в шаблоне использовать это свойство.

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

enum Size = {
  XLarge,
  Large,
  Medium,
  Small
}

@Component({
    selector: 'app-size-select',
    template: `
        <select [ngModel]="selectedSize">
            <option value="{{ size.XLarge }}">Extra Large</option>
            <option value="{{ size.Large }}">Large</option>
            <option value="{{ size.Medium }}">Medium</option>
            <option value="{{ size.Small }}">Small</option>
        </select>    
    `
})
export class SizeSelectComponent { 
    @Input() selectedSize: Size;
    size = Size;
}

Похожие записи

Upload файла в Angular по клику кнопки

Создано простейшее nestjs приложение, принимающее файлы. Выбор и отправка файла по клику подразумевает, что на форме отсутствует input для файла. Отправка запроса осуществляется с отслеживанием прогресса.

Переиспользуемые анимации в Angular

Для создания анимации используется функция animation(). Для её использования — useAnimation(). Приводится пример переиспользуемой анимации, а также создание анимации через литерал объекта.

09 октября 2018 г. в Angular

Angular. Manually retry http request

На память. Некоторое время назад я решил достаточно необычную задачу, но в последствии на backend`е переделали логику и код был удалён из проекта.

Angular & MVVM

  • Model - just file like user.class.ts
  • View - HTML template of component
  • ViewModel - Typescript part of a component