【问题标题】:How do you update a controller from another controller in ember.js?如何从 ember.js 中的另一个控制器更新一个控制器?
【发布时间】:2015-10-01 07:45:28
【问题描述】:

在我的应用程序中,我有一个通向主应用程序布局的通用标题。在该标题中,您可以选择一个站点。我需要该站点选择来更新在应用程序布局中呈现的另一个模板。经过几天的努力,我认为解决这个问题的正确方法是使用共享服务,让标头控制器观察站点选择并在共享服务中设置该值,然后让索引控制器使用 Ember .computed.alias 服务控制器中的值。以下是我的代码示例:

控制器/header.js

import Ember from 'ember';

export default Ember.Controller.extend({
  sessionService: Ember.inject.service(),

  currentSiteChanged: Ember.observer('session.current_site', function(){
    var current_site = this.get('session.current_site');
    console.log('currentSiteObserver', current_site);
    this.get('sessionService').set('currentSite', current_site);
  }),

});

控制器/index.js

import Ember from 'ember';

export default Ember.Controller.extend({
  sessionService: Ember.inject.service(),
  currentSite: Ember.computed.alias('sessionService.currentSite'),
  dashboardData: function(){
    var currentSite = this.get('currentSite');
    console.log("in dashboardData", currentSite);
    //other code that uses the currentSite
  }.property('currentSite'),
});

services/session-service.js

import Ember from 'ember';

export default Ember.Service.extend({
  currentSite: null,

  setCurrentSite: function(){
    var currentSite = this.get('session.current_site');
    this.set('currentSite', currentSite );
  }.on('init'),
});

我认为这应该允许某人在标题中选择一个站点,并在索引更新中使用 dashboardData 属性以使用该选择。当页面最初加载标题时,默认为第一个站点并且索引呈现它具有它必须从会话服务获得的正确站点值,但是如果您选择另一个站点,则索引不会得到更新。通过 console.logs 和调试,我可以看到 header 正在观察更改并在 session-service 上设置值。

此外,我已经尝试过解决其他方法(将标头服务注入索引并观察属性,将索引注入标头并直接设置值,发送和侦听事件等)但我愿意尝试任何事情或要更正,这不是解决问题的正确方法。

我正在使用 ember 1.13.8,目前无法选择迁移到 2。

【问题讨论】:

    标签: ember.js


    【解决方案1】:

    我认为服务不是解决这个问题的合适方法。

    您希望您的应用程序具有良好的RESTful url design(尊重 url 是 Ember 框架的基石),因此请尝试在 URL 中捕获您的应用程序状态。

    考虑一下,如果用户要选择一个站点,然后点击刷新,他们将失去他们的选择,除非您以某种方式将其存储在 cookie 或 localStorage 中。

    我建议使用路由或查询参数来解决您的问题。

    路线
    使用路由非常简单 (http://whatever.com/sites/pet-hampsters)。

    查询参数
    您还可以使用查询参数,例如 http://whatever.com/?site=pet%20hampsters

    为此,您需要编写一个action,它会冒泡到您的应用程序控制器并设置“站点”queryParam 的值。然后,当前活动路由上的任何子控制器都可以使用 new Ember.inject syntax. This is the conventional way to manage dependencies between controllers 读取站点值。

    【讨论】:

    • 好点。我非常专注于解决问题,我没有考虑它是如何构建的。谢谢。
    • 使用 ember 很容易做到。我不得不从头开始重写我的第一个 ember 项目,因为我只见树木不见森林。但是一旦 Ember 点击了我就觉得我再也不想使用其他任何东西了,但是学习过程非常痛苦;-)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-01-11
    • 2015-09-07
    • 1970-01-01
    • 2016-07-18
    • 2015-05-12
    相关资源
    最近更新 更多