Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Added namespace tracking to $compile #8628

Closed
wants to merge 5 commits into from
Closed

Added namespace tracking to $compile #8628

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b6b266d
WIP
benlesh Aug 15, 2014
6a4d9a0
add foreignObject handling
benlesh Aug 15, 2014
98ef4aa
added one ridiculous test just to make sure
benlesh Aug 15, 2014
15117b3
some clean up
benlesh Aug 20, 2014
8e296f7
readded previous tests
benlesh Aug 20, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
113 changes: 95 additions & 18 deletions src/ng/compile.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
'use strict';

window.dump = function() {};

/* ! VARIABLE/FUNCTION NAMING CONVENTIONS THAT APPLY TO THIS FILE!
*
* DOM-related variables:
@@ -545,6 +547,35 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
// 'on' and be composed of only English letters.
var EVENT_HANDLER_ATTR_REGEXP = /^(on[a-z]+|formaction)$/;

var svgWrap = function(template) {
var wrapper = document.createElement('div');
wrapper.innerHTML = '<svg>'+template+'</svg>';
return wrapper.childNodes[0].childNodes;
};

var SVG_NAMESPACE = {
type: 'svg',
wrap: svgWrap,
clone: svgWrap,
cloneJqLite: function(elements) {
var nodes = [];
forEach(elements, function(element) {
nodes.push(svgWrap(element.outerHTML)[0]);
});
return jqLite(nodes);
}
};

var HTML_NAMESPACE = {
type: 'html',
wrap: identity,
clone: jqLiteClone,
cloneJqLite: function(elements) {
return JQLitePrototype.clone.call(elements);
}
};


/**
* @ngdoc method
* @name $compileProvider#directive
@@ -852,12 +883,15 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
//================================

function compile($compileNodes, transcludeFn, maxPriority, ignoreDirective,
previousCompileContext) {
previousCompileContext, namespace) {
if (!($compileNodes instanceof jqLite)) {
// jquery always rewraps, whereas we need to preserve the original selector so that we can
// modify it.
$compileNodes = jqLite($compileNodes);
}

$compileNodes.namespace = namespace || HTML_NAMESPACE;

// We can not compile top level text elements since text nodes can be merged and we will
// not be able to attach scope data to them, so we will wrap them in <span>
forEach($compileNodes, function(node, index){
@@ -867,16 +901,20 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
});
var compositeLinkFn =
compileNodes($compileNodes, transcludeFn, $compileNodes,
maxPriority, ignoreDirective, previousCompileContext);
maxPriority, ignoreDirective, previousCompileContext, namespace);
safeAddClass($compileNodes, 'ng-scope');
return function publicLinkFn(scope, cloneConnectFn, transcludeControllers, parentBoundTranscludeFn){
assertArg(scope, 'scope');
// important!!: we must call our jqLite.clone() since the jQuery one is trying to be smart
// and sometimes changes the structure of the DOM.
// NOTE: namespace passed into cloneJqLite on $compileNodes

var $linkNode = cloneConnectFn
? JQLitePrototype.clone.call($compileNodes) // IMPORTANT!!!
? $compileNodes.namespace.cloneJqLite($compileNodes) // IMPORTANT!!!
: $compileNodes;

$linkNode.namespace = $compileNodes.namespace;

forEach(transcludeControllers, function(instance, name) {
$linkNode.data('$' + name + 'Controller', instance);
});
@@ -914,34 +952,51 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
* @returns {Function} A composite linking function of all of the matched directives or null.
*/
function compileNodes(nodeList, transcludeFn, $rootElement, maxPriority, ignoreDirective,
previousCompileContext) {
previousCompileContext, namespace) {
var linkFns = [],
attrs, directives, nodeLinkFn, childNodes, childLinkFn, linkFnFound;

for (var i = 0; i < nodeList.length; i++) {
attrs = new Attributes();

var node = nodeList[i];
namespace = namespace || HTML_NAMESPACE;

var nodeTagName = nodeName_(node);
if(nodeTagName === 'svg') {
namespace = SVG_NAMESPACE;
}
// else if(nodeTagName === 'foreignobject') {
// namespace = HTML_NAMESPACE;
// }

nodeList.namespace = namespace;

// we must always refer to nodeList[i] since the nodes can be replaced underneath us.
directives = collectDirectives(nodeList[i], [], attrs, i === 0 ? maxPriority : undefined,
directives = collectDirectives(node, [], attrs, i === 0 ? maxPriority : undefined,
ignoreDirective);

nodeLinkFn = (directives.length)
? applyDirectivesToNode(directives, nodeList[i], attrs, transcludeFn, $rootElement,
null, [], [], previousCompileContext)
? applyDirectivesToNode(directives, node, attrs, transcludeFn, $rootElement,
null, [], [], previousCompileContext, namespace)
: null;

if (nodeLinkFn) {
nodeLinkFn.namespace = nodeLinkFn.namespace || namespace;
}

if (nodeLinkFn && nodeLinkFn.scope) {
safeAddClass(attrs.$$element, 'ng-scope');
}

childLinkFn = (nodeLinkFn && nodeLinkFn.terminal ||
!(childNodes = nodeList[i].childNodes) ||
!(childNodes = node.childNodes) ||
!childNodes.length)
? null
: compileNodes(childNodes,
nodeLinkFn ? (
(nodeLinkFn.transcludeOnThisElement || !nodeLinkFn.templateOnThisElement)
&& nodeLinkFn.transclude) : transcludeFn);
&& nodeLinkFn.transclude) : transcludeFn, undefined, undefined, undefined, undefined, namespace);

linkFns.push(nodeLinkFn, childLinkFn);
linkFnFound = linkFnFound || nodeLinkFn || childLinkFn;
@@ -999,7 +1054,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {

function createBoundTranscludeFn(scope, transcludeFn, previousBoundTranscludeFn) {

var boundTranscludeFn = function(transcludedScope, cloneFn, controllers) {
var boundTranscludeFn = function(transcludedScope, cloneFn, controllers, namespace) {
var scopeCreated = false;

if (!transcludedScope) {
@@ -1008,7 +1063,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
scopeCreated = true;
}

var clone = transcludeFn(transcludedScope, cloneFn, controllers, previousBoundTranscludeFn);
var clone = transcludeFn(transcludedScope, cloneFn, controllers, previousBoundTranscludeFn, namespace);
if (scopeCreated) {
clone.on('$destroy', function() { transcludedScope.$destroy(); });
}
@@ -1189,7 +1244,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
*/
function applyDirectivesToNode(directives, compileNode, templateAttrs, transcludeFn,
jqCollection, originalReplaceDirective, preLinkFns, postLinkFns,
previousCompileContext) {
previousCompileContext, namespace) {
previousCompileContext = previousCompileContext || {};

var terminalPriority = -Number.MAX_VALUE,
@@ -1276,6 +1331,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
$compileNode = templateAttrs.$$element =
jqLite(document.createComment(' ' + directiveName + ': ' +
templateAttrs[directiveName] + ' '));
$compileNode.namespace = namespace;
compileNode = $compileNode[0];
replaceWith(jqCollection, sliceArgs($template), compileNode);

@@ -1291,9 +1347,20 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
nonTlbTranscludeDirective: nonTlbTranscludeDirective
});
} else {
$template = jqLite(jqLiteClone(compileNode)).contents();
$compileNode.empty(); // clear contents
childTranscludeFn = compile($template, transcludeFn);
$template = $compileNode.contents();
$template.remove();
childTranscludeFn = (function($template) {
return function childTranscludeFnFactory() {
var namespaceArg = arguments[4];
var childTranscludeFn = childTranscludeFnFactory.fn;

if (!childTranscludeFn) {
childTranscludeFn = childTranscludeFnFactory.fn = compile($template, transcludeFn, undefined, undefined, undefined, namespaceArg);
}

return childTranscludeFn.apply(undefined, arguments);
}
}($template));
}
}

@@ -1313,7 +1380,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
if (jqLiteIsTextNode(directiveValue)) {
$template = [];
} else {
$template = jqLite(wrapTemplate(directive.type, trim(directiveValue)));
$template = jqLite(namespace.wrap(trim(directiveValue)));
}
compileNode = $template[0];

@@ -1325,6 +1392,14 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {

replaceWith(jqCollection, $compileNode, compileNode);

var compileNodeTagName = nodeName_($compileNode[0]);
if (compileNodeTagName === 'svg') {
nodeLinkFn.namespace = $compileNode.namespace = SVG_NAMESPACE;
} else if(compileNodeTagName=== 'foreignobject') {
nodeLinkFn.namespace = $compileNode.namespace = HTML_NAMESPACE;
}


var newTemplateAttrs = {$attr: {}};

// combine directives from the original node and from the template:
@@ -1604,6 +1679,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
for(i = postLinkFns.length - 1; i >= 0; i--) {
try {
linkFn = postLinkFns[i];
$element.namespace = nodeLinkFn.namespace;
linkFn(linkFn.isolateScope ? isolateScope : scope, $element, attrs,
linkFn.require && getControllers(linkFn.directiveName, linkFn.require, $element, elementControllers), transcludeFn);
} catch (e) {
@@ -1612,7 +1688,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
}

// This is the function that is injected as `$transclude`.
function controllersBoundTransclude(scope, cloneAttachFn) {
function controllersBoundTransclude(scope, cloneAttachFn, namespace) {
var transcludeControllers;

// no scope passed
@@ -1625,7 +1701,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
transcludeControllers = elementControllers;
}

return boundTranscludeFn(scope, cloneAttachFn, transcludeControllers);
return boundTranscludeFn(scope, cloneAttachFn, transcludeControllers, namespace);
}
}
}
@@ -1815,6 +1891,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
if (!(previousCompileContext.hasElementTranscludeDirective &&
origAsyncDirective.replace)) {
// it was cloned therefore we have to clone as well.
// NOTE: namespace is not taken into account here. Should it be?
linkNode = jqLiteClone(compileNode);
}

4 changes: 2 additions & 2 deletions src/ng/directive/ngTransclude.js
View file
Original file line number Diff line number Diff line change
@@ -65,9 +65,9 @@ var ngTranscludeDirective = ngDirective({
startingTag($element));
}

$transclude(function(clone) {
$transclude(null, function(clone) {
$element.empty();
$element.append(clone);
});
}, $element.namespace);
}
});
Loading