javascript - 从路由文件中设置模板文件中的变量

Question

我的index.hbs 文件中有此代码:

<button {{action 'showHotspots'}} class="btn btn-success padding">{{hotspotCategory.name}}</button>

我的routes/index.js 文件中有showHotspots 方法:

showHotspots: function( selection ) {
  this.toggleProperty( 'idFromButton' );
}

该方法应该在我的routes/index.js中切换这部分:

{{#if idFromButton}}
  <p>Test1</p>
{{/if}}

但是，这不起作用，当我将其作为组件执行时，它可以工作，但我需要将 Test1 放在页面上的特定位置(在所有生成的按钮下方)。当我在组件中执行此操作时，Test1 将显示在按钮之间。

我不想使用组件，而是想在我的 index.js 文件中执行此操作，这样我就可以控制页面的结构。

简而言之:在我的 index.hbs 上，我有一个 if 语句来检查变量是否为 true。我想使用在同一index.hbs 文件或从component-1.hbs 文件中调用的方法从我的routes/index.js 文件(或从其他地方，实际上并不重要)设置此变量。

Answer 1

如果我理解这个问题，您使用组件，您应该在组件的操作上使用方法“showHotspots”，如果不理解，您应该在 Controller 的操作上使用此方法。
最好详细描述您的问题。
编辑:如果您使用旧版本的 ember js，这是一个示例

//#### controller index.js
App.IndexController = Ember.Controller.extend({
    idFromButton: false,
    actions: {
        showHotspots: function( selection ) {
            this.toggleProperty( 'idFromButton' );
        }
    }
});


//#### index.hbs  (your index controller template)
<button {{action 'showHotspots'}} class="btn btn-success padding">some text</button>
{{#if idFromButton}}
  <p>Test1</p>
{{/if}}