Question

我在控制器中有一个属性。我想使用组件来更新该控制器属性。通常的组件参数传递在我使用类似指南的文本字段时起作用，但在我的情况下，我改变了代码中的值，而不是输入字段。绑定似乎被打破了。

我应该使用类似于propertyDidChange（）或notifyPropertyChange（）的方法来实现此目的？你能提供一个简单的例子，我知道在哪里调用该方法吗？

个性控制器

`import Ember from 'ember'`

PersonalitiesController = Ember.ArrayController.extend

  eiValue: ->
    if params.name
      params.name.charAt(0)
    else
      'e'

  nsValue: ->
    if params.name
      params.name.charAt(1)
    else
      'n'

  tfValue:  ->
    if params.name
      params.name.charAt(2)
    else
      't'

  pjValue:  ->
    if params.name
      params.name.charAt(3)
    else
      'p'

  type: (->
    this.get('eiValue') + this.get('nsValue') + this.get('tfValue') + this.get('pjValue')
  ).property('eiValue', 'nsValue', 'tfValue', 'pjValue')

  typeChanged: ((model, type)->
    Ember.run.once(this, 'routeToPersonality')
  ).observes('type')

  routeToPersonality: ->
    this.get('controller').transitionToRoute('personality', this.get('type'))

`export default PersonalitiesController`

个性模板

%dichotomy-selector type=type

组件

`import Ember from 'ember'`

DichotomySelectorComponent = Ember.Component.extend
  eiValue: 'e'
  nsValue: 'n'
  tfValue: 't'
  pjValue: 'p'

  type: (->
    newValue = this.get('eiValue') + this.get('nsValue') + this.get('tfValue') + this.get('pjValue')
    this.set('controller.type', newValue)
  ).property('eiValue', 'nsValue', 'tfValue', 'pjValue')

  actions: 
    toggleEI: ->
      eiValue = this.get('eiValue')
      if eiValue == 'e'
        this.set('eiValue', 'i')
      else if eiValue == 'i'
        this.set('eiValue', 'e')

    toggleNS: ->
      nsValue = this.get('nsValue')
      if nsValue == 'n'
        this.set('nsValue', 's')
      else if nsValue == 's'
        this.set('nsValue', 'n')

    toggleTF: ->
      tfValue = this.get('tfValue')
      if tfValue == 't'
        this.set('tfValue', 'f')
      else if tfValue == 'f'
        this.set('tfValue', 't')

    togglePJ: ->
      pjValue = this.get('pjValue')
      if pjValue == 'p'
        this.set('pjValue', 'j')
      else if pjValue == 'j'
        this.set('pjValue', 'p')

`export default DichotomySelectorComponent`

Answer 1

~~根据此处的文档，您应该可以在组件内的方法中使用this.set("controller.property", value)：http://emberjs.com/api/classes/Ember.Component.html#property_controller~~

2016年9月编辑 这个答案一直是Ember不断发展的受害者，也是最佳实践的相关变化。令人惊讶的是，看看Ember与1.5年前有多么不同。旧的答案已被社区完全拒绝，如投票所证明的那样（我输入的内容是否定的），实际上我认为它甚至不再适用。截至2016年中期，在Ember 2.x中，对此问题的普遍接受的答案是在控制器中创建一个更改属性的操作，将该操作传递给组件，并在组件上的值更改时调用操作。但是现在您可以使用操作助手来传递常规方法而不是操作，并使用组件生命周期钩子来检测组件中的更改，而不是使用观察者或计算属性。您也可以使用服务。我相信，路上会有更多变化。

对于任何未来的读者，您需要研究有关Ember的任何问题，以确保您按时间过滤结果，您只需要在去年内获得结果。

如何从组件更改控制器属性？

1 个答案: