У меня есть угловая директива:
app.directive('templater', function() {
return{
restrict: 'E',
templateUrl: '../../tmpl/themer.html',
link: function(scope, element, attrs){
// execute metisMenu plugin
setTimeout(function(){
$(element).templater();
}, 1);
}
}
});
Цель состоит в том, чтобы вытащить html из themer.html на главную страницу.
Прямо сейчас в моем my_profile.html у меня есть тег <templater></templater>
.
Теперь html отображается отлично, однако css и js не работают. Теги css в шаблоне, на которые ссылается директива, влияют и подвержены влиянию тех же js и css файлов, связанных с родительским документом.
Как сообщить директиве о соблюдении правил родительского файла в вставленном файле?
благодаря
Используйте $ timeout углового вместо setTimeOut. Ввести зависимость $ timeout в директиве
Вы не будете загружать css
& js
из частичного представления, так как тег link
& script
не будет загружен. Частичный загрузит только html. Если вы хотите заставить их работать, обратитесь к этому ответу
Примечание
Вы должны $timeout
вместо setTimeout
, что обеспечит обновление вашего углового элемента привязкой на html.
// execute metisMenu plugin
$timeout(function(){
$(element).templater();
}, 1);
link
и script
находятся в родительском HTML-документе, а не во встроенном документе. Я думаю, что моя ссылка неверна. все, что я хочу сделать, - это модульный формат моего родительского документа с кучей вставок. Мне сказали использовать директивы в качестве шаблонов tmpl. Для этого я переместил свой html в файл шаблона и загрузил его, используя директиву. Но теперь мои css и js больше не работают в этом модуле шаблона. Что я делаю? Благодарю.