Почему мы не можем напрямую использовать console.log в Angular?

1

Скажем, у меня есть переменная, и я хочу увидеть ее значение в консоли. Но в Angular я не могу просто написать {{ console.log(variable) }} в моем шаблоне. Я должен воссоздать эту функцию в своем классе, например:

test.component.ts:

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

Тогда я могу получить значение:

test.component.html:

{{ log(variable) }}

Так почему я не могу просто написать {{ console.log(variable) }}?

  • 1
    Вы можете следовать этому ответу в stackoverflow тот же вопрос в stackoverflow
  • 0
    @Claies - это был, вероятно, лучший ответ. Спасибо! Если вы предоставите ответ, я приму его
Показать ещё 8 комментариев
Теги:
angular

4 ответа

3
Лучший ответ

Таким образом, в Angular (2/4) единственное, что доступно в шаблоне, - это вещи, попадающие в сферу вашего соответствующего класса компонентов, т.е. все, что вы могли бы сказать "this.blah" в ts.

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

@Component({
    selector: 'my-component',
    template: 'This is my template {{console.log(variable)}}'
})
export class MyComponent {
    console = console;
    variable = 'yay';
}

(ключевая строка здесь console = console;)

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

Поделиться
  • 0
    Возможно, вы захотите объявить консоль общедоступной при доступе к ней из компонента. Не требуется для JiT, но это ловушка, когда вы переходите на AoT.
  • 1
    Нет, к счастью, вам не нужно этого делать, так как public является значением по умолчанию - поэтому, если вы ничего не укажете, это будет public :)
3

В: Почему я не могу просто написать {{console.log(variable)}}?

Ответ: короткий ответ. Поскольку console встроенной функциональности не является частью объекта $scope объекта.

Поделиться
  • 0
    Просто добавив в комментарии, чтобы сказать, что этот ответ неверен, потому что мы говорим об Angular 2/4, а не AngularJS / 1. Нет $ scope или контроллера :)
1

Это происходит потому, что console.log() является частью глобального window объекта и объекта окна не могут быть доступны непосредственно в шаблонах.

Всякий раз, когда угловые двигатели находят строку интерполяции {{}}, она использует встроенную службу interpolation которая в основном возвращает область, связанную с выражением, и оценивает переменные, используемые в этой области, в отношении этой возвращенной области. Шаблон имеет доступ только к тем свойствам, которые находятся в его области. объект window не относится к сфере действия компонента/контроллера, поэтому его нельзя использовать напрямую.

Надеюсь, он очистит ваше замешательство.

Поделиться
0

вы должны использовать функцию

ех.

$scope.log2=function(param){
   console.log(param);
}

затем используйте функцию

{{log2(variable)}}
Поделиться
  • 0
    Как указано выше, этот вопрос относится к Angular 2/4, а не к AngularJS / 1.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню