Angular为什么将ng-scope类放在没有附加范围的元素上

Question

I have a jQuery plugin that does template transformation, and an Angular directive that integrates with the plugin by calling $compile after the plugin runs on the produced DOM node:

//in the link function of tiFormRender directive
element.empty();
compileForm(newForm, tiForms.frameworks(), element);
$compile(element.children())(scope);

This correctly processes directives in the subtree produced by the plugin, but for some reason it adds the class ng-scope to the compiled template:

<div ti-form-render="testForm">
    <md-content class="layout-padding ng-scope layout-row">
        <-- more DOM -->    
    </md-content>
</div>

The ti-form-render element (the original directive which does not create a scope) and the md-content element have the same scope as I would expect (verified with element.scope() ) so why did Angular attach the ng-scope class to an element that doesn't actually have a scope?

Answer 1

ng-scope is added to any element where a scope is attached (one scope can be attached in multiple places), and since the $compile process attaches a scope to a template, it adds the class to the processed template. It just looks a bit weird here since the scope it's attaching is the same one as the parent element, due to my hacky solution.