我对ember.js的工作原理还不是很了解。（一个字符串数组）。到目前为止，除了更新的features属性没有保存外，其他一切似乎都正常。当我单击复选框时，它会更新multi-select-checkboxes组件中选定的计算属性。我想如果我将model.owner.features作为selected传递给组件，那么当组件发生变化时，它会直接更新模型。

(function() {
  const { shroud } = Sw.Lib.Decorators;

  Sw.FranchisorNewAnalyticsConnectionsUsersRoute = Ember.Route.extend({
    currentFranchisorService: Ember.inject.service('currentFranchisor'),

    @shroud
    model({ account_id }) {
      console.log("load model in route")
      return Ember.RSVP.hash({
        account: this.get('store').find('account', account_id),
        owners: Sw.AccountOwner.fetch(account_id),
        newAccountOwner: Sw.AccountOwner.NewAccountOwner.create({ accountID: account_id }),
      });
    },

    actions: {
      @shroud
      accountOwnersChanged() {
        this.refresh();
      },

      close() {
        this.transitionTo('franchisor.newAnalytics.connections');
      },
    },
  });
})();

用户控制器：

(function() {
  const { shroud, on, observer } = Sw.Lib.Decorators;
  Sw.FranchisorNewAnalyticsConnectionsUsersController = Ember.Controller.extend(Sw.FranchisorControllerMixin, {
    isAddingUser: false,

    adminOptions: [{
      label: 'Employee Advocacy',
      value: 'employee advocacy'
    }, {
      label: 'Second Feature',
      value: 'other'
    }, {
      label: 'Can edit users?',
      value: 'edit_users'
    }],

  });
})();

users.handlebars

{{#each model.owners as |owner|}}
   <tr
    <td>
     {{owner.name}}
    </td>
    <td>
     {{owner.email}}
    </td>
    <td>{{if owner.confirmedAt 'Yes' 'No'}}</td>
    <td>
      {{log 'owner.features' owner.features}}
      {{multi-select-checkboxes 
         options=adminOptions 
         selected=owner.features
         owner=owner
         model=model
       }}
     </td>
     <td>
       <button class="btn light-red-button" 
         {{action "remove" owner}}>
         Remove
       </button>
     </td>
   </tr>
 {{/each}}

multi-select-checkboxes.handlebar:

{{#each checkboxes as |checkbox|}}
  <p>
    <label>
      {{input type='checkbox' checked=checkbox.isChecked}}
      {{checkbox.label}}
    </label>
  </p>
{{/each}}

多选择复选框.jsx：

// Each available option becomes an instance of a "MultiSelectCheckbox" object.
var MultiSelectCheckbox = Ember.Object.extend({
  label: 'label',
  value: 'value',
  isChecked: false,

  changeValue: function () { },
  onIsCheckedChanged: Ember.observer('isChecked', function () {
    var fn = (this.get('isChecked') === true) ? 'pushObject' : 'removeObject';
    this.get('changeValue').call(this, fn, this.get('value'));
  })
});

Sw.MultiSelectCheckboxesComponent = Ember.Component.extend({
  labelProperty: 'label',
  valueProperty: 'value',
  // The list of available options.
  options: [],
  // The collection of selected options. This should be a property on
  // a model. It should be a simple array of strings.
  selected: [],
  owner: null,
  model: null,
  checkboxes: Ember.computed('options', function () {
      console.log("CHECKBOXES", this.get('model'))
    var _this = this;
    var labelProperty = this.get('labelProperty');
    var valueProperty = this.get('valueProperty');
    var selected = this.get('selected'); 
    var model = this.get('model'); 
    return this.get('options').map(function (opt) {
      var label = opt[labelProperty];
      var value = opt[valueProperty];
      var isChecked = selected.contains(value);
      return MultiSelectCheckbox.create({
        label: label,
        value: value,
        isChecked: isChecked,
        model: model,
        changeValue: function (fn, value, model) {
          _this.get('selected')[fn](value);
          console.log("model in middle", this.get('model'))
          this.get('model').save();
        }
      });
    });
  }),
  actions: {
    amountChanged() {
      const model = this.get(this, 'model');
      this.sendAction('amountChanged', model); 
    }
  }
});