How to make a controller work from a template inserted by a directive?

Question

Angular

There is a spherical directive in vacuum:

angular
    .module('app')
    .directive('block', function () {
        return {
            replace: true,
            restrict: 'A',
            templateUrl: function (element, attr) {
                return 'blocks/' + attr.block + '.html';
            }
        };
    });

Main pattern:

<!-- … -->
<div block="example"></div>
<!-- … -->

Template (blocks/example.html):

<div ng-controller="ExampleCtrl as example">
    <p ng-bind="example.text"></p>
</div>

Controller:

angular
    .module('app')
    .controller('ExampleCtrl', ExampleCtrl);
function ExampleCtrl() {
    this.text = 'Текст'
}

Essence The
template is successfully inserted, but for some reason it ignores the attribute ng-controller="ExampleCtrl as example"in the first element of the template, which is why it <p ng-bind="example.text"></p>remains empty.
If you create a directive with replace: false, then the controller will work, but the wrapper will remain.
Or if the attribute is shifted one level lower in the template, then the controller will also work:

<div>
    <div ng-controller="ExampleCtrl as example">
        <p ng-bind="example.text"></p>
    </div>
</div>

Is it because the directive creates its own scope?
Is there any easy way to force a directive to use controller scope without creating extra wrappers?

Answer 1

For these purposes, there is ng-include.

Answer 2

stackoverflow.com/questions/22575424/angularjs-ng-...
But it's better not to overcomplicate with custom directive binding to specify the controller in the template, but simply specify the controller in the directive module.

angular
    .module('app')
    .directive('block', function () {
        return {
            replace: true,
            restrict: 'A',
            templateUrl: function (element, attr) {
                return 'blocks/' + attr.block + '.html';
            },
            controller: 'ExampleCtrl',
            controllerAs: 'example',
            bindToController: true
        };
    });