如何在路径中设置变量并在模板中显示？

Posted 2021-05-06

我希望为每个设置为text的页面设置一个变量，以显示为动态标题。如何在路径中设置变量并将其显示在相应的模板中？到目前为止，我所尝试的一切都没有用。

答案

路径中模板的上下文是其控制器，而不是其路径。尝试将动作移动到控制器。

见更新的twiddle：https://ember-twiddle.com/b454e10355ae8c708c3b8dc24b51e44e?openFiles=controllers.my-route.js%2C

有关控制器的更多信息：https://guides.emberjs.com/v2.16.0/controllers/

另一答案

您只能使用model钩子将路径变量传递给模板。但是，model只被召唤一次。为了更新路径变量并在模板中查看其最终值，您需要包装变量。之后，您需要更新包装内的变量，并且不会更改包装的referance。你的代码就像：

route.js：

model(){
    this._super(...arguments);
    this.set('myWrappedVariable', {myVariable: 1});
    let modelResult = {myWrappedVariable: this.get('myWrappedVariable')};

    return modelResult;
},

actions:{
    increaseVariables(){
        Ember.set(this.get('myWrappedVariable'), 'myVariable', this.get('myWrappedVariable.myVariable')+1);
    }
}

template.hbs

myWrappedVariable: {{model.myWrappedVariable.myVariable}}

Take a look at this twiddle用于此用途。

另一答案

@Gaurav的回答是完全正确的，应被视为最佳做法。但是，如果您有充分的理由在Route中设置变量（不是模型），则可以使用setupController hook：

import Route from '@ember/routing/route';

export default Route.extend({
  setupController(controller, model) {
    // Call _super for default behavior
    this._super(controller, model);

    // Set a variable on controller
    controller.set('foo', 'bar');
  }
});

如api文档中所示，您还可以使用setupController通过使用controllerFor方法获取其实例来在另一个控制器上设置变量。但是我不认为这是一个好的做法，因为如果在整个应用程序中没有很好地记录，那么维护这样的代码就很难了。

如@AhmetEmreKılınç的回答所示，你也可以使用哈希作为模型。如果它的至少一个属性是Promise，你应该返回一个RSVP.hash()。否则model hook不会阻止过渡，直到承诺完成。