Directive scope test - AngularJS 1.3
Incorrect inheritance of parent scope for directives using replace and ngRepeat on the root element.
HTML
<script src="https://code.angularjs.org/1.3.16/angular.js"></script>
<h1>Not Broken:</h1>
<not-broken></not-broken>
<h1>Broken in 1.3.x but not 1.2.x:</h1>
<broken></broken>
JavaScript
/**
* Common template, shared between each of the test directives. This template simply
* loops through all values in the values array, displaying a message stored on the
* scope for each of those values.
*/
var commonTemplate = '<div ng-repeat="value in values">{{value}}: {{message}}</div>';
/**
* Common controller, shared between each of the test directives. This controller
* only adds a pair of properties to the scope: a test message, and an array of
* static values.
*/
var commonController = function commonController($scope) {
/**
* Arbitrary test message.
*
* @type String
*/
$scope.message = 'Test';
/**
* Array of test values.
*
* @type Number[]
*/
$scope.values = [1, 2, 3];
};
angular.module('myApp', []);
/*
* notBroken - Exactly the same as broken, but replace is false.
*/
angular.module('myApp').directive('notBroken', function notBroken() {
return {
replace : false,
restrict : 'E',
scope : {},
template : commonTemplate,
controller : commonController
};
});
/*
* broken - Exactly the same as notBroken, but replace is true.
*/
angular.module('myApp').directive('broken', function broken() {
return {
replace : true,
restrict : 'E',
scope : {},
template : commonTemplate,
controller : commonController
};
});