Использование импортированной функции машинописи в Angular HTML

#html #angular #typescript #components

Вопрос:

У меня есть служебный класс TypeScript myUtils.ts , как показано ниже:

 export class MyUtils {
  static doSomething(input: string) {
    // do something
  }
}

Я хочу вызвать этот метод в HTML-файле моего компонента. Для этого я импортировал этот класс в свой компонент

 import { MyUtils } from './utils'

и использовать в HTML-файле компонента примерно так:

 <ng-template #dynamicTableCell let-entry>  
  {{ MyUtils.doSomething(entry) }}
</ng-template>

HTML жалуется на Unresolved variable or type MyUtils это . Интересно, что я могу сделать то же MyUtils.doSomething(someEntry) самое без каких-либо ошибок в файле компонента component.ts . Это просто HTML, в котором он жалуется.

Может кто-нибудь, пожалуйста, сказать мне, как исправить эту проблему в HTML? Заранее спасибо.

1. Вы рассматривали возможность использования угловой службы вместо вашего класса utils? В своем html-коде к вашему компоненту вы сможете {{newService.doSomething(entry)}}

2. Вы не можете, но не составит большого труда добавить прокси-члена в свой класс компонентов doSomething = MyUtils.doSomething; и использовать его

Ответ №1:

Вы не можете его использовать, так как шаблонные выражения ограничены ссылками на элементы экземпляра компонента, вам необходимо создать метод в своем компоненте или в вашем случае использовать угловой канал.

компонент.ts

 import { MyUtils } from './utils';
...

doSomething(entry) {
  MyUtils.doSomething(entry);
}



// or

doSomething = MyUtils.doSomething;

Вы можете ознакомиться с документом Выражения шаблонов.