如何避免访问范围。$ parent在ng-repeat内的指令内

时间:2017-06-29 11:53:39

标签: javascript angularjs

我已经建立了一个自定义指令

这是我的指示

angular.module('app')
.directive("pdf", function() {
  return {
    restrict: 'E',
    scope: {
      page: '=',
      pdfDoc: '='
    },
    link : function(scope, element, attributes, vm){
      console.log(scope.$parent.pdfDoc)
      scope.page.doc = scope.$parent.pdfDoc;
      console.log(scope);

      vm.renderPage(scope.page.doc, scope.page.id, scope.page.num, scope.page.rotation);

    },
    templateUrl: 'components/pdfViewer/views/pdfViewer.directive.html',
    controller: pdfViewerController,
    controllerAs: 'vm',
  }
});

这是我的父控制器&#h;

<div class="thumbnail vthumbnail" ng-repeat="page in pages" data-drop="true" data-drag="true" ng-model="pages" jqyoui-droppable="{index: {{$index}}}" jqyoui-draggable="{index: {{$index}}, insertInline: true, direction:'jqyouiDirection'}" data-jqyoui-options="{revert: 'invalid'}" data-direction="{{page.jqyouiDirection}}" ng-init="doc = pdfDoc">

<pdf page="page" pdfDoc="doc"></pdf> 
</div>

我的问题是如何将pdfDoc(在父控制器的范围内)分配给指令pdf。看起来ng-repeat创建了自己的范围。我试过ng-init =&#34; doc = pdfDoc&#34;但我无法访问

中的文档
<pdf page="page" pdfDoc="doc"></pdf>. 

我现在提出的唯一解决方案是在指令中使用范围。$ parent。但是,如果我想制作指令pdf moduler,那么它不是一个干净的解决方案。

你们知道如何将父控制器的scope.variable传递给ng-repeat中的指令吗?

1 个答案:

答案 0 :(得分:1)

Angular convert camelCasing to snake-casing,因此在DOM中将pdfDoc重命名为pdf-doc

<pdf page="page" pdf-doc="doc"></pdf>.