Тип литья в шаблоне в Angular 2

Я работаю над проектом Angular (Angular 4.0.0), и мне не удается привязать свойство абстрактного класса к ngModel, потому что сначала мне нужно указать его как конкретный класс, на самом деле он для доступа к собственности.

то есть. У меня есть класс AbstractEvent, у этого есть конкретное событие реализации, которое имеет логическое свойство "признано", которое мне нужно для двусторонней привязки через ngModel для установки с помощью флажка.

В настоящее время у меня есть этот элемент в моей DOM:

<input type="checkbox" *ngIf="event.end" [(ngModel)]="(event as Event).acknowledged" 
                                          [disabled]="(event as Event).acknowledged">

К сожалению, это вызывает следующую ошибку:

Ошибка поиска: ошибки анализа шаблона: Parser Error: Отсутствует ожидаемое) в столбце 8 в [(событие как событие). Подтверждено]

Похоже, что поиск в Google, по-видимому, предполагает, что использование "как" не поддерживается при использовании его внутри шаблона? Хотя я не уверен в этом.

Я также не могу решить, как просто написать функцию для него в моем файле typescript, управляющем шаблоном, потому что это нарушит привязку двух ссылок на ngModel, который мне нужен.

Если у кого-то есть способ обойти это или выполнить кастинг типов в шаблонах Angular правильно, я был бы очень благодарен!

Ответ 1

Это невозможно, потому что Event нельзя ссылаться из шаблона.

(as также не поддерживается в выражениях привязки шаблона) <Удаp > Сначала вам нужно сделать его доступным:

class MyComponent {
  EventType = Event;

тогда это должно работать

[(ngModel)]="(event as EventType).acknowledged"

Забастовкa >

Обновление

class MyComponent {
  asEvent(val) : Event { return val; }

затем используйте его как

[(ngModel)]="asEvent(event).acknowledged"

Ответ 2

Как уже упоминалось, использование вызова метода barebone окажет влияние на производительность.

Лучше всего использовать трубу, и вы получите лучшее из обоих миров. Просто определите Литую трубу:

@Pipe({
  name: 'cast',
  pure: true
})
export class CastPipe implements PipeTransform {

  constructor() {
  }

  transform(value: any, args?: any): Event {
    return value;
  }
}

а затем в вашем шаблоне используйте event | cast event | cast когда вам нужен актерский состав.

Таким образом, обнаружение изменений остается эффективным, а набор текста безопасен (конечно, с учетом запрошенного изменения типа).

К сожалению, я не вижу способа получить этот универсальный из-за атрибута name, поэтому вам придется определить новый канал для каждого типа.