在Rails中将文本文件内容加载到JavaScript中

我有一个SVG文件，我想通过JavaScript在我的Rails应用程序中动态加载，内联。我需要内嵌加载SVG，以便我可以对其应用CSS fill属性。在Rails中将文本文件内容加载到JavaScript中

我宁愿不通过AJAX加载SVG文件，以避免SVG可见之前的潜在滞后。

理想我喜欢做的是告诉的是，在我的app/assets/icons/目录，我有图标calendar.svg和phone.svg Rails和Rails所（链轮？）应该采取那些SVG文件的内容，并将它们设置为字符串值在JavaScript对象SVG，这样我可以访问他们在我的JavaScript代码是这样的：

var view = { 
    render: function() { 
    this.element.innerHTML = SVG['app/assets/icons/calendar.svg']; 
    } 
};

优选地，所述溶液是广义的不仅仅是SVGs更多，并且经由I可能加载以文本格式的任何数据JS，例如TEXT['app/assets/icons/calendar.svg']或甚至TEXT['app/assets/etc/some-text-file.text']。

有没有办法在Rails中做到这一点？

来源

2017-04-12 Jackson

是什么阻止你把你的视图模板（如ERB）内SVG的内容是什么？ – emaillenin

虽然我可以，但是这并不能很好地扩展，因为如果我的服务器返回的HTML中有很多SVG，浏览器将花费更长时间来完成下载HTML并显示页面;而如果我在一个网络请求中加载SVG（可能是我已经做出的JS请求），那么可以将该加载推迟到页面上有东西供用户查看之后。 – Jackson

该问题的另一个答案是，该应用程序是SPA，由于许多体系结构原因，该视图需要使用JS而不是ERB模板创建。 – Jackson

我们结束了写一个链轮变压器这样的：https://github.com/cloversites/js-text-rails

$ bundle install js-text-rails

需要您的文件，例如在app/assets/javascripts/application.js:

//= require_tree ../images/icons

凡app/assets/images/icons包含文件envelope.svg。

在任何地方你的应用程序的JavaScript代码，通过全局变量SVG访问文本文件的内容：

var envelopeIcon = SVG['icons/envelope']; 
// Do something with `envelopeIcon`...

来源

2017-04-21 19:11:42 Jackson

在Rails中将文本文件内容加载到JavaScript中

回答

相关问题