ember.js - Ember 中的“action”不调用 Controller 方法

Question

我转换了这个 Ember Rails 应用 https://github.com/kagemusha/ember-rails-devise-demo从 coffeescript 到 javascript。当我单击链接时，AuthController 中的登录和注册操作完美地工作，但是，当我单击注销按钮时，我收到一个错误，没有任何处理注销事件，即使有一个操作设置在同一个 Controller 作为其他两个链接。

Uncaught Error: Nothing handled the event 'logout'. 

        {{view App.MenuItem href="#/login" label="Login" }}
        {{view App.MenuItem href="#/registration" label="Register"}}
         <button class="btn" {{action logout}}>Logout</button>

您能看出为什么 AuthController 中的注销操作可能无法处理该事件吗？它适用于 coffeescript 版本。

更新，有一个 App.NavbarController 扩展了 ObjectController 并将注销包装在操作散列中。

导航栏 Controller

  App.NavbarController = Ember.ObjectController.extend({
    needs: ['auth'],
    isAuthenticated: Em.computed.alias("controllers.auth.isAuthenticated"),
    actions: {
      logout: function() {   
        return this.get("controllers.auth").logout();
      }
    }
  });

认证 Controller

App.AuthController = Ember.ObjectController.extend({
    currentUser: null,
    isAuthenticated: Em.computed.notEmpty("currentUser.email"),
    login: function(route) {
      var me;
      me = this;
      return $.ajax({
        url: App.urls.login,
        type: "POST",
        data: {
          "user[email]": route.currentModel.email,
          "user[password]": route.currentModel.password
        },
        success: function(data) {
          log.log("Login Msg " + data.user.dummy_msg);
          me.set('currentUser', data.user);
          return route.transitionTo('home');
        },
        error: function(jqXHR, textStatus, errorThrown) {
          if (jqXHR.status === 401) {
            return route.controllerFor('login').set("errorMsg", "That email/password combo didn't work.  Please try again");
          } else if (jqXHR.status === 406) {
            return route.controllerFor('login').set("errorMsg", "Request not acceptable (406):  make sure Devise responds to JSON.");
          } else {
            return p("Login Error: " + jqXHR.status + " | " + errorThrown);
          }
        }
      });
    },
    register: function(route) {
      var me;
      me = this;
      return $.ajax({
        // url: App.urls.register,
        url: "/users.json",
        type: "POST",
        data: {
          "user[name]": route.currentModel.name,
          "user[email]": route.currentModel.email,
          "user[password]": route.currentModel.password,
          "user[password_confirmation]": route.currentModel.password_confirmation
        },
        success: function(data) {
          me.set('currentUser', data.user);
          return route.transitionTo('home');
        },
        error: function(jqXHR, textStatus, errorThrown) {
          return route.controllerFor('registration').set("errorMsg", "That email/password combo didn't work.  Please try again");
        }
      });
    },
    logout: function() {
      var me;
      console.log("Logging out...");
      me = this;
      return $.ajax({
        url: App.urls.logout,
        type: "DELETE",
        dataType: "json",
        success: function(data, textStatus, jqXHR) {
          $('meta[name="csrf-token"]').attr('content', data['csrf-token']);
          $('meta[name="csrf-param"]').attr('content', data['csrf-param']);
          log.info("Logged out on server");
          me.set('currentUser', null);
          return me.transitionToRoute("home");
        },
        error: function(jqXHR, textStatus, errorThrown) {
          return alert("Error logging out: " + errorThrown);
        }
      });
    }
  });

Answer 1

你能展示更多你的模板和 View 吗？在原始代码中，应用程序模板使用渲染标签来渲染 NavBar，这会渲染 NavBar 模板并启动 NavBar Controller 。您可能希望将带有控制台日志的 init 函数放入 Controller 中，以确保其正确创建:

init: function(){
    this._super();
    console.log('navbar controller starting...');
}

我注意到您发布的模板代码不包含 {{#if isAuthenticated}} 部分 - 它工作正常吗？