如何与transcluded元素共享指令范围?

时间:2016-03-29 20:09:59

标签: angularjs scope angularjs-ng-transclude

我正在尝试使用transclusion创建一个指令。问题是转换部分的范围不同于指令范围的范围。 我在plnkr上尝试过这里是链接 - http://plnkr.co/edit/vDfXs9zyfAngPqmFCiZR?p=preview 我希望指令具有隔离范围,但能够根据单击的按钮在选项卡之间切换。

index.html
<maple-multistep-form steps="steps">
<span>transcluded scope - {{selection}}</span>
<div ng-switch="" on="selection">
  <!-- First Step -->
  <div ng-switch-when="Step 1: Team Info">
    <ng-include src="'step1.html'"></ng-include>
  </div>
  <!-- Second Step -->
  <div ng-switch-when="Step 2: Campaign Info">
    <ng-include src="'step2.html'"></ng-include>
  </div>
  <!-- Third Step -->
  <div ng-switch-when="Step 3: Campaign Media">
    <ng-include src="'step3.html'"></ng-include>
  </div>
</div>

1 个答案:

答案 0 :(得分:1)

尝试将'selection'传递给指令。

http://plnkr.co/edit/23QO2UGvKwwXK7PRo2bJ?p=preview

 <maple-multistep-form steps="steps" selection="selection">

和里面

 scope: {   //comment scope to make the directive have shared scope, this makes the directive work fine
  steps: '=',
  selection: '=?'
},