指令的angularJS parentNode为null

Question

我已经定义了一个指令，并指定了模板并添加了一个编译函数。就像下面一样

mainApp.directive("mySpan", function () {
    return {
        restrict: 'E',
        template: '<span style=\"background-color:gray;color:orange\">pppdsf</span>',
        replace: true,
        require:'^uiScroll',
        compile: function (template, attrs) {
            return {
                post:function (scope, element, attrs, scrollController) {
                    var pp = 1;
                }
            }
        }
    }
});

但是有一个错误找不到scrollController。原因是template[0].parentNode.parentNode是null，因此无法找到parentNode的控制器属性。有没有人遇到过这个错误？

<div ng-controller="mainController as mainCtr">
    <ul class="dataArea">
        <li ui-scroll="item in suggestionList.dataSource" buffer-size="10">
            <my-span></my-span>
        </li>
    </ul>
</div>