需要有关Angular和isolate作用域和指令(无模板)的帮助

Question

我正在尝试以下场景，但没有成功(使用angular 1.4.7)，并希望获得一些如何继续进行的指导。我将下面的超文本标记语言(简化)作为角度视图(并使用$route等)。

pagedListController包含函数'selectStuff($event)‘。

<div ng-controller="domainController as pageCtrl">
    <div paged-list api="pageCtrl.api">
        <button ng-click="pgList.selectStuff($event)"></button>
    </div>
</div>

和以下指令(同样，简化)

app.directive('pagedList', function() {
   return {
       restrict: 'A',
       scope: {},
       bindToController: {
          api: '='
       },
       controller: 'pagedListController',
       controllerAs: 'pgList',
       compile: function(tElem, tAttrs, transcludeFn) {
           function linkFn(scope, element, attrs, controller, transcludeFn) {
               transcludeFn(scope, function(clone, scope) {
                   element.append(clone);
               }
           }

           return linkFn;
       }
   };

})

问题是:虽然'api‘被正确绑定，但在分页列表指令的内容中对pgList的引用实际上从未调用过selectStuff()。我无论如何也不明白为什么不这样做。我浏览了angular文档、几十篇博客和其他帖子，就是看不出有什么问题。有什么建议吗？

Answer 1

回答我自己的问题：

上面的原始演示文稿实际上有一个错误，导致了所有的不同，我写成

function linkFn(scope, element, attrs, controller, transcludeFn) {
    transcludeFn(scope, function(clone, scope) {
        element.append(clone);
    }
}

这在我的真实代码中是不正确的。

我的实际代码调用transcludeFn()时没有'scope‘初始参数，只有回调函数( 'scope’参数在transcludeFn中是可选的)。

我不理解的是，Angular Tips博客(http://angular-tips.com/blog/2014/03/transclusion-and-scopes/)上的一篇文章很好地解释了这一点，即分页列表中被转换的内容(即按钮)的默认作用域是分页列表的父级的作用域，而不是分页列表的作用域。

将按钮的作用域设置为分页列表作用域的方法是在transcludeFn中设置可选的第一个' scope‘参数。然后，被转换的内容的作用域将该作用域用作自己的作用域。未指定，该参数在默认情况下设置为paged list-scope.$parent。强制它到分页列表作用域可以解决所有问题，因为pgList就是在这里定义的。

感谢博客文章作者Jesus非常清楚地解释了这一切是如何真正工作的。