javascript - 如何在 ember 中使用服务器生成的内容链接到特定的 Rails API 路由？

Question

我有一个混合的 Ember/Rails 应用程序，在 API 命名空间中有一个 Rails 路由，可以获取任何单个事件并将其转换为 .ics用于导入用户日历的文件(如 this question )。 Ember 正在使用命令 ember server --proxy http://localhost:3000 运行，它将它连接到 Rails 服务器进程。

以下片段说明了我的设置:

rails routes.rb片段:

namespace :api do
  # snip
  resources :events do
  # snip
      get 'export_event_ical', on: :member
  end
end

rails events_controller.rb片段:

def export_event_ical
    @event = Event.find(params[:id])
    @calendar = Icalendar::Calendar.new
    ical_event = Icalendar::Event.new
    ical_event.dtstart = @event.start.strftime("%Y%m%dT%H%M%S")
    ical_event.dtend = @event.start.strftime("%Y%m%dT%H%M%S")
    ical_event.summary = @event.body.truncate(50)
    ical_event.description = @event.body
    # event.location = @event.location
    @calendar.add_event ical_event
    @calendar.publish
    headers['Content-Type'] = "text/calendar; charset=UTF-8"
    render :text => @calendar.to_ical
end

例如，在我的 Ember/Handlebars 索引模板中，如果我有 event引用单个事件的参数，我可以使用 <a href="http://localhost:3000/api/events/{{ event.id }}/export_event_ical">Export to iCal</a>到达 Rails 提供的 API 路由(即跳过端口 4200 上的 Ember 并在端口 3000 上与 Rails 通信)。

到目前为止一切顺利。 但是我如何将其变成一个动态的 Ember 控制链接，通过 Ember 路由到 Rails？

我尝试了一些不起作用的方法:

• 添加到 Ember 的路由 events资源(router.js):

  this.resource('events', function() {
    this.route('show', {path: ':event_id'});
    this.route('export_to_ical', {
      path: '/api/events/:event_id/export_event_ical'
    });
  });
  

• 向 events.js 添加一些愚蠢的 jQuery路由作为按钮操作并使用 <button {{action 'exportToICal' event.id}}>Export to iCal</button>在我的模板中:

  从“ember”导入 Ember；

  export default Ember.Route.extend({
    actions: {
      exportToICal: function(eventID) {
        $.get('/api/events/' + eventID + '/export_event_ical',
              function(){
                alert('Got here.');
              }); 
      }
    }
  });
  

• 阅读一些文档:

  • http://guides.emberjs.com/v1.10.0/components/sending-actions-from-components-to-your-application
  • EmberJS - How to dynamically generate link with linkTo?

你应该如何在 Ember 中执行此操作？

Answer 1

在我的应用程序中，我使用环境来声明服务器端点，有点像在 Rails 中，在底部:

/* jshint node: true */
'use strict';

var extend = require('util')._extend;

module.exports = function(environment, appConfig) {
  var ENV = extend(appConfig, {
    EmberENV: {
      FEATURES: {
        // Here you can enable experimental features on an ember canary build
        // e.g. 'with-controller': true
      }
    },

    APP: {
      // Here you can pass flags/options to your application instance
      // when it is created
    },
  });

  if (environment === 'development') {
    ENV.serverHost = 'http://localhost:3000';
  }

  return ENV;
};

然后你可以这样获取值

var config = this.container.lookup('config:environment');
var url = config.serverHost + "/...";