如何在同一页面上添加多个ember-power-select组件

Question

我面临与添加多个ember-power-select字段相关的问题。 我希望每当我点击帐户信息部分的“添加”按钮时，在视图中添加一个新的ember-power-select组件。 因为每个“用户”都可以拥有多个帐户。 目前我通过模板中的硬代码手动添加两个组件

<div class="row" style="margin-bottom:20px">
          <div class="form-group"  style="padding-bottom:50px">
              <label for="inputEmail3" class="col-sm-2 control-label" style="text-align:right; margin-top: 3px">Account</label>
              <div class="col-xs-7">
                  {{#power-select-multiple
                  selected=selectedAccount
                  options=accounts
                  searchField ="title"
                  onchange=(action "chooseDestination")
                  onopen=(action "verifyPresence")
                  onkeydown=(action "handleKeydown")
                  as |account|
                  }}
                      {{account.title}}
                  {{/power-select-multiple}}
              </div>
              <i class="fa fa-plus-circle fa-2x" aria-hidden="true" style="margin-top: 0px"></i>
          </div>
      </div>

      <div class="row" style="margin-bottom:20px">
          <div class="form-group"  style="padding-bottom:50px">
              <label for="inputEmail3" class="col-sm-2 control-label" style="text-align:right; margin-top: 10px">Account</label>
              <div class="col-xs-7">
                  {{#power-select-multiple
                  selected=selectedAccount
                  options=accounts
                  searchField ="title"
                  onchange=(action "chooseDestination")
                  onopen=(action "verifyPresence")
                  onkeydown=(action "handleKeydown")
                  as |account|
                  }}
                      {{account.title}}
                  {{/power-select-multiple}}
              </div>
          </div>
      </div>

但问题是，如果我在一个组件中选择值，它同时在第二个组件中同时选择值，那么ember-select的两个组件的行为都相同。enter image description here