如何在 Ember js 中将错误消息传递给来自不同控制器的路由

Question

让我有两条路线和两个控制器，即 login 和 signup 如果我注册成功，那么我想使用 success 消息作为参数执行到路由登录的转换，

/app/signup/controller.js

import Controller from '@ember/controller';

export default Controller.extend({
    actions: {
        signup: function(){
            let _this = this;
            let successMessage = 'successfully registered';
            var credentials = this.getProperties('name','identification','password');
            let list = this.store.createRecord('user', {
                name: credentials.name,
                email: credentials.identification,
                password: credentials.password
            });
            list.save().then(function(){
                _this.transitionToRoute('login','successMessage');
            });
        }
    }
});

app/login/template.hbs

<body>
  {{successMessage}}
</body>

/app/router.js

import EmberRouter from '@ember/routing/router';
import config from './config/environment';

const Router = EmberRouter.extend({
  location: config.locationType,
  rootURL: config.rootURL
});
Router.map(function() {
  this.route('login');
  this.route('signup');
});

export default Router;

Answer 1

我认为你有 3 个选择：

使用路由参数（查询参数或位置参数）
使用服务来管理登录内容，并从代表您的状态的服务中读取一些计算属性/来自您的登录控制器的消息
使用 flash/toast 样式 UI 消息位于应用 view/component 层次结构之外

就个人而言，对于要显示消息的位置，我会选择 #2，如下所示：

// app/services/user-session.js
import Service from '@ember/service';

export default class extends Service {
  successMessage = null;

  signup(name, id, password) {
    // logic
    this.set('successMessage', 'yay');
  }
}

// app/controllers/signup.js
import Controller from '@ember/controller';
import { service } from '@ember-decorators/service';
import { action } from '@ember-decorators/object';

export default class extends Controller {
  @service userSession;

  @action
  signup() {
    this.userSession.signup(...);
    this.transition...
  }
}

// app/controllers/login.js
import Controller from '@ember/controller';
import { service } from '@ember-decorators/service';
import { readOnly } from '@ember-decorators/object/computed';

export default class extends Controller {
  @service userSession;

  @readOnly('userSession.successMessage') successMessage;
}

或者，在旧语法中：

// app/services/user-session.js
import Service from '@ember/service';

export default Service.extend({
  successMessage: null,

  signup(name, id, password) {
    // logic
    this.set('successMessage', 'yay');
  }
});

// app/controllers/signup.js
import Controller from '@ember/controller';
import { inject as service } from '@ember/service';

export default Controller.extend({
  userSession: service(),

  actions: {
    signup() {
      this.userSession.signup(...);
      this.transition...
    }
  }
});

// app/controllers/login.js
import Controller from '@ember/controller';
import { inject as service } from '@ember/service';
import { readOnly } from '@ember/object/computed';

export default Controller.extend({
  userSession: service(),

  successMessage: readOnly('userSession.successMessage')
});

希望这对您有所帮助

如何在 Ember js 中将错误消息传递给来自不同控制器的路由

How to pass Error Message to Route from a different Controller in Ember js

ember.js