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

Question

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

下面的 sn-ps 说明了我的设置：

Rails routes.rb sn-p：

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

Rails events_controller.rb sn-p:

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 路由（即，跳过 Ember在 4200 端口上，并在 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 + "/...";