为什么按钮上的操作事件不会调用控制器功能

Question

我有一个index.html文件，它有一个带有操作处理程序的按钮。

<button {{action 'modules'}} > press </button> 

但是当我按下按钮时没有任何反应。

请看代码在jsbin：

http://jsbin.com/OREMORe/1/edit

随时纠正其他任何不一致。 感谢任何帮助。谢谢。

Answer 1

你会这样做this。请注意，您的代码存在一些问题：

1）您的按钮中没有包裹在把手中的句柄代码script标记 2）您的'模块'模板位于应用程序模板中 3）您没有包含到必要库的有效链接 4）没有为应用程序指定rootElement 5）您尝试访问ApplicationRoute中的ModulesController。我插入了一个重定向到'模块' 6）您试图在您的{{#each}}循环中访问module，但在您的模型中不存在。你想要的是content。

<script type="text/x-handlebars" data-template-name="application"> 
{{outlet}} 
</script> 

<script type="text/x-handlebars" data-template-name="modules"> 
    <ul> 
     {{#each content}} 
     <li>{{this}}</li> 
     {{/each}} 
     <button {{action 'modules'}} > press </button> 
    </ul> 
    </script> 

和：

var Test1 = Ember.Application.create({ 
    rootElement: 'body', 
    ready: function() { 
     console.log("App ready1"); 
    } 
}); 

Test1.IndexRoute = Ember.Route.extend({ 
    redirect: function() { 
    this.transitionTo('modules'); 
    } 
}); 


Test1.Router.map(function() { 
    this.route('modules'); 
}); 

Test1.ModulesController = Ember.Controller.extend({ 
    actions: { 
     modules: function() { 
      console.log('clicked the button'); 
/*   this.transitionToRoute('modules');*/ 
     } 
    } 
}); 
Test1.ModulesRoute = Ember.Route.extend({ 
    model: function() { 
     return ['item1', 'item2']; 
    } 
});