Я построил приложение Angular 2, в котором есть шаблон javascript (например, открытие/создание меню меньше, закрытие панелей контента). Мне было интересно, что будет лучшим способом сохранить этот тип «шаблона широкий» javascript?Angular 2 template wide javascript
Например:
// Panel toolbox
$(function() {
$('.collapse-link').on('click', function() {
var $BOX_PANEL = $(this).closest('.x_panel'),
$ICON = $(this).find('i'),
$BOX_CONTENT = $BOX_PANEL.find('.x_content');
// fix for some div with hardcoded fix class
if ($BOX_PANEL.attr('style')) {
$BOX_CONTENT.slideToggle(200, function(){
$BOX_PANEL.removeAttr('style');
});
} else {
$BOX_CONTENT.slideToggle(200);
$BOX_PANEL.css('height', 'auto');
}
$ICON.toggleClass('fa-chevron-up fa-chevron-down');
});
$('.close-link').click(function() {
var $BOX_PANEL = $(this).closest('.x_panel');
$BOX_PANEL.remove();
});
});
Есть некоторые Javascript, что мне нужно будет использовать на каждом компоненте, который имеет панель контента. Должен ли я импортировать в каждом компоненте? Или я могу создать пользовательскую директиву и импортировать ее в свой корневой компонент?
Редактировать: нормально, мне ясно, что я не должен использовать этот jquery, но я просто хочу написать код в машинописном тексте. Мой вопрос все еще остается:
Следует ли импортировать часто используемую функцию в каждый компонент или определить функцию в родительском компоненте и использовать ее в дочерних компонентах?
Механизм шаблона Angular2 не выполнит '