Sails.js - Как вставить файл js в определенный маршрут?

Например, у меня есть страница /locations/map, в которую мне нужно включить Google Map, и включить .js (например, location.js) специально для этой страницы.

Я хочу добавить эти 2 файла после  этой строки

Можно ли это сделать?

ПРИМЕЧАНИЕ. Я использовал Sails.js v0.10

Ответы

Ответ 1

Sails использует ejs-locals в рендеринге представления, поэтому вы можете выполнить то, что хотите, с блоками.

В вашем layout.ejs файле под  добавьте (например):

<%- blocks.localScripts %>

Затем в представлении, которое вы показываете в /locations/map, вызовите блок с тегом script, например:

<% block('localScripts', '<script src="https://maps.googleapis.com/maps/api/js"></script>') %>

В качестве альтернативы вы можете поместить теги  и  в <head> вашего макета, а затем добавить свои сценарии, специфичные для просмотра, непосредственно в свое представление, а не использовать блоки. Это прекрасный вариант, если вы не возражаете ждать, когда эти связанные скрипты будут загружены до отображения содержимого вашей страницы.

Ответ 2

Scott answer - это правильный способ вставить неглобальный JS в конкретное представление. Просто небольшой комментарий, хотя: вызов block из представления не должен иметь тире. Он должен быть следующим:

<% block('localScripts', '<script src="https://maps.googleapis.com/maps/api/js"></script>') %>

Оба вызова будут работать, но использование тире делает вставку дважды; после загрузки представления и предшествующего рендерингу макета, а затем снова, когда представление вставлено в рендерную базовую компоновку. Это приводит не только к тому, чтобы вставлять/запускать излишне дважды один и тот же код, но также и с ошибками, которые нарушают ваш JS-код, если вставленный script зависит от библиотек, которые у вас есть в вашем базовом макете (например, jQuery, Backbone).

EJS интерпретирует магию <%- как "insert unescaped". Итак, я думаю, что это делает вызов функции block(), которая возвращает наш тег HTML <script>. Это заменяется там, где было вызвано волшебство, но также выполняет внутри него функцию block(), которая выполняет замену блока localScripts.

С другой стороны, <% означает "инструкция". I.e., просто запустите этот фрагмент кода JS, который не отражается в представлении, где вызывается.

Ответ 3

Я открываю другой способ сделать это

В MapController.js

// you can add as many as you like
res.locals.scripts = [
  '//maps.googleapis.com/maps/api/js',
];
return res.view();

В layout.ejs

<!--SCRIPTS-->
<!--SCRIPTS END-->

<!-- Loop through all scripts that passed from controller -->
<% if (scripts) { %>
    <% for (i = 0; i < scripts.length; i++) { %>
        <script src="<%- scripts[i] %>"></script>
    <% } %>
<% } %>

Ответ 4

Я знаю, что это старый вопрос, я обнаружил еще один вариант.

Файл:

конфигурации\routes.js

код:

'/': 'HomeController.StartHome'

Я установил функцию StartHome в HomeController, ответственную за управление маршрутом "/".

Файл:

апи\Контроллеры\HomeController.js

код:

StartHome: function(req, res) {

    var template_data = {
        "data" : {
            "view_name" : "home_view"
        }

    }

    res.view('home_view', template_data)
}

Здесь я создал объект с некоторыми данными, которые передаются в шаблон EJS (клиенту).

Файл:

вид\layout.ejs

код:

<% if (data["view_name"] === "home_view") { %>
<script src="script_for_home_view.js"></script>
<% } %>

В моем layouts.ejs я создал оператор if, который "включает" тэг script в зависимости от того, на котором я в настоящее время включен.

Вот как я справляюсь с этим. Надеюсь, вам это ясно.

Паруса 0.12.4