Question

让我有两条路线和两个控制器，分别是 login 和 signup 如果我成功注册，那么我想使用成功消息作为参数

过渡到路由登录

/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，消息位于应用程序视图/组件层次结构之外

就个人而言，您想在哪里显示消息，我会去找＃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中从其他控制器传递错误消息以进行路由

1 个答案: