Question

我有一个选择器如下：

 <ui-select theme="bootstrap"
             name="targets_selected"
             ng-model="campaign_offer.target_audience_id"
             aa-field-name="{{'_TargetAudience_' | i18n}}"
             required aa-val-msg>
    <ui-select-match placeholder="{{'_SelectTargetAudience_' | i18n}}">{{$select.selected.name}}
    </ui-select-match>
    <ui-select-choices
      repeat="ta.id as ta in possible_targets">
      {{ta.name}}
    </ui-select-choices>

  </ui-select>

我一切顺利，但是，当我试图将其作为可重用的ui组件时，我遇到了一些问题。

我写了以下代码

angular.module("commonModule").directive "targetAudienceSelect", ->
  scope: {targets: '=ctvTargets', selected_target: '=ctvSelectedTarget'}
  restrict: "A"
  replace: true
  templateUrl: "/assets/directives/selectors/target_audience_selector.html"



<div class="form-group" ng-form="formTAC">
  <label for="TargetAudience" class="col-md-12 nopadding">{{'_TargetAudience_' | i18n}}</label>

  <div id="TargetAudience" class="">
    <ui-select theme="bootstrap"
               name="targets_selected"
               ng-model="selected_target"
               ng-change="target_changed(selected_target)"
               aa-field-name="{{'_TargetAudience_' | i18n}}"
               required aa-val-msg>
      <ui-select-match placeholder="{{'_SelectTargetAudience_' | i18n}}">{{$select.selected.name}}
      </ui-select-match>
      <ui-select-choices
        repeat="ta.id as ta in targets">
        {{ta.name}}
      </ui-select-choices>

    </ui-select>
  </div>
</div>

为了使用它，我把下面的内容

<div target-audience-select ctv-targets=possible_targets ctv-selected-target=campaign_offer.target_audience_id></div>

我可以看到选择器中的项目。但是当我选择一个项目时，我的控制器中的选定项目不会改变，当我只是将指令html复制粘贴到我的视图中时，它就会这样做，但是当它用作指令时却没有。

我正在使用ui-select作为选择指令

添加了plunkr

如何解决？

为什么该指令封装了我的范围？

0 个答案: