javascript - EmberJS 2.7 - 如何为按钮绑定(bind)属性 'disabled'

Question

This官方指南描述了如何将 bool 属性绑定(bind)到 HTML 元素的禁用属性。然而它谈论的是 Controller 。

我有一个按钮，单击时会转换路线(抱歉，它必须是一个按钮，不能是链接):

/templates/trails.hbs

<button type="button" class="btn btn-primary" disabled={{isEditing}} 
              onclick={{route-action 'addNew'}}>Add New</button>

(route-action 是一个帮助器，允许我在路由中使用关闭操作)

/routes/trails.js

import Ember from 'ember';

export default Ember.Route.extend({
  actions: {
    addNew() {
      this.transitionTo('trails.new');
    } 
  }
});

因此，单击按钮后，路线将更改为“trails.new”

/routes/trails/new.js

import Ember from 'ember';

export default Ember.Route.extend({
  isEditing: true,
});

该属性似乎被忽略，并且没有像我预期的那样受到约束。我还尝试添加 Controller :

/controllers/trails/new.js

import Ember from 'ember';

export default Ember.Controller.extend({
  isEditing: true,
});

那么官方指南是如何建议一些看似行不通的东西的呢？我在这里缺少什么 Ember 魔法？

Answer 1

您的模板是templates/trails.hbs但你设置了isEditing在子路由 Controller 中controllers/trails/new.js

您需要有controllers/trails.js和 deinfe isEditing就在其中。

所以在 routes/trails.js实现这个:

actions: {
    willTransition: function(transition) {
      if(transtions.targetName === 'trails.new'){
        this.controller.set('isEditing', true);
      }
      else{
        this.controller.set('isEditing', false);
      }
    }
  }