Trying to repro AngularJS bug

by fschwiet

HTML

<div ng-controller='parent' data-insertion-method='append'>
        first outer text
        <div ng-controller='child'>
            first inner text
        </div>
    </div>

    <div ng-controller='parent' data-insertion-method='prepend'>
        second outer text
        <div ng-controller='child'>
            second inner text
        </div>
    </div>

CSS

div {
    margin: 10px;
}

[ng-controller='child'] {
    color: blue
}

JavaScript

var module = angular.module('test', []);

    module.controller("parent", function($element) {
        var insertionMethod = $element[0].dataset["insertionMethod"];
        var newElement = document.createElement("span");
        $element[insertionMethod](newElement);
    });
    
    module.controller("child", function($scope, $element) {
        $element.text("$element points to a " + $element.toString());
    });
    
    angular.bootstrap(document.querySelector('body'), ['test']);