So after grinding at it for quite a while, I found a solution. Bottom line,
template mangles dom interaction in directive compile function (eg. only
returns partial strings for innerHTML and such - it's messed up). The
solution was to forego template and transclude (doing those manually in
compile function), pull out the innerHTML from the compile directive
function's tElement parm, set the innerHTML string to blank (''), and then
create a jQuery collection from the innerHTML. That then behaves normally
in terms of DOM manipulation.
After the manipulation, $compile the result in the link function, and add
it back to the live DOM.
It's messed up.
Here's the code that works:
.directive('mwDelegateBlockList',['$compile','mwParse',function($compile,mwParse){
return {
restrict:'E',
// template:template,
// transclude:true,
compile:compile
}
// function template(element, attributes) {
// }
function compile(tElement,tAttrs) {
var html = tElement.html();
tElement.html('');
var format = tAttrs['mwFormat'] || 'list';
if (format == 'grid') {
html = `<md-grid-list>${html}</md-grid-list>`;
} else if (format == 'table') {
html = `<table>${html}</table>`;
} else { // 'list'
html = `<md-list>${html}</md-list>`;
}
var $content = angular.element(html);
function link(scope, element, attributes, constructor) {
console.log('scope',scope);
var children = $content.children(); // selector
children('mw-template') does not work
var length = children.length;
for (var i = 0; i < length; i++) {
var child = angular.element(children[i]);
if (child.prop('tagName').toLowerCase() == 'mw-template') {
var mwIf = child.attr('mw-if');
if (mwIf) {
// check if template is required for current format
var retain = mwParse.expression(mwIf)(scope);
// if not remove it
if (!retain) child.remove();
}
}
}
console.log('$content',$content);
var content = $compile($content)(scope);
element.append(content);
}
return link;
}
}])
- Henrik
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
