如何与嵌入的元素共享指令范围？

Question

我正在尝试创建一个带有嵌入的指令。问题是嵌入部分的范围与指令范围不同。我已经在 plnkr 上试过了，这里是 link - 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>

Answer 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: '=?'
},

如何与嵌入的元素共享指令范围？

How to share directive scope with transcluded elements?

scope

angularjs

angularjs-ng-transclude