Question

我来到stackoverflow感觉有点失败。我已经远远地搜索了这个问题的答案，但我从一个按钮开始动作似乎没有触发模板的正确更新，我不知道为什么。

我直接从ember docs for route actions开始工作，并尝试了更多内容组合，例如内联与组件，而不是我想管理的内容。唉，我很难过，所以我来这里寻求帮助。这是我的代码：

＆＃13;

// app/admin/users/edit/route.js
import Ember from 'ember';

export default Ember.Route.extend({
  isEditingPassword: false,
  actions: {
    toggleBody() {
      this.toggleProperty('isShowingBody');
    },
    editPassword() {
      this.toggleProperty('isEditingPassword')
      console.log('(after toggle) isEditingPassword', this.get('isEditingPassword'))
    },
    saveUser(model) {
      model.save().then(()=> {
        console.log('we saved!')
        this.transitionTo('admin.users');
      })
    }
  }
});

＆＃13;

<!-- app/admin/users/edit/template.hbs -->
{{outlet}}
<button {{action "editPassword" on="click"}} class='button is-danger'>{{if isEditingPassword "Edit user" "Edit Password"}}</button>
{{input class="input" type="text" name='title' value=isEditingPassword placeholder="True"}}


{{#admin-user isEditingPassword=isEditingPassword model=model saveUser='saveUser'}}{{/admin-user}}

＆＃13;

这个调用的组件本身很简单，看起来像这样：

＆＃13;

// app/components/admin-user/component.js

import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    saveUser(model) {
      console.log('save the user!', model)
      this.sendAction('saveUser', model);
    },
    cancel() {
      this.sendAction('cancel')
    }
  }
});

＆＃13;

<!-- app/components/admin-user/template.hbs -->
{{yield}}
{{#unless isEditingPassword}}
  {{#admin-user-form model=model
    saveUser='saveUser'}}
  {{/admin-user-form}}
{{else}}
  {{#admin-user-password-form model=model
    saveUser='saveUser'}}
  {{/admin-user-password-form}}
{{/unless}}

＆＃13;

也存在较低的组件，但与此问题无关。

有这个问题的踢球者，正如你从上面的代码中看到的那样，我还有一个绑定到同一属性的 ember输入助手。更新此文本输入有效，并使下部组件中的条件按预期触发，并更新按钮文本。但是对于按钮，下部组件既不是条件的，也不是按钮中的内联条件功能，并且保持默认状态。

我已经详尽地试图寻找答案，但是我还是空白了。我还尝试在路线和下层组件上使用计算属性来无效。我确信这是一个简单的解决方案，但我完全错过了它。

所以我的问题很简单，为什么按钮的动作不会触发模板中的条件更新？ console.log事件会触发。任何帮助，将不胜感激。

Answer 1

Route上的属性在您的模板中不可用。模板的上下文是路由的Controller，它是路由模型钩子返回的模型的代理（意外错误的重要来源）。

为了以这种方式使用路由操作，您需要更新控制器上的参数，或更新模型上的属性。

或者，实现Controller。用于处理操作和公开计算属性的顶级路由控制器仍然完全正常，尽管您可能已经听说过将来的弃用。

Ember 2.6按钮操作绑定未触发模板更新

1 个答案: