использование шаблона углового 2 console.log

Я хотел бы использовать console.log внутри встроенного шаблона, но не могу найти никаких указаний.

@Component({
  selector:"main",
  providers: [ItemService],
  template:'
    <ul>
     <li *ngFor="let item of items">
      {{console.log(item)}} <----- ??? 
      <p>{{item.name}}</p>
     </li>
    </ul>

  '
})
export class HomeComponent {
  private items: Array<ItemModel>;

  constructor() {}
}

Ответ 1

Вы не можете получить доступ к глобальным, статическим,...

Вы можете получить доступ только к свойствам компонента, к которому принадлежит представление.

Вы можете добавить

log(val) { console.log(val); }

к вашему компоненту и использовать его как

{{log(item)}}

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

Для отладки я предпочитаю

 {{item | json}}

Ответ 2

Лучший способ сделать это:

Таким образом вы можете получить доступ ко всем свойствам консоли на стороне шаблона

Компонентная сторона:

export class AppComponent  {
  console = console;
}

Сторона шаблона:

{{ console.log('----------------> Logging') }}
{{ console.warn('----------------> Warning') }}
{{ console.error('----------------> error') }}

РАБОЧАЯ ДЕМО