I am trying to render some ejs. I'm not using any frameworks. So right now I have an ejs navigation bar template and a template for a random other site (in this example it is just a form).
My directory:
root
rendered (cache for already rendered sites)
sites (ejs templates for sites)
form.ejs
test.ejs (template I am trying to insert into form.ejs)
templates (ejs templates for reusable stuff like the nav-bar)
bar.ejs
server.js (logic for the server: including rendering of ejs)
So now comes the actual question: How do I reference an other ejs template in an ejs template? The docs say:
%- include('user/show') %>
Includes ./user/show.ejs into the template (As I understood it relative to the current ejs file if no absolute path is given)
<% include user/show %>
is not supported after v3.0, but would have done (almost) the same.
So now I thought I could just do
<%- include('test') %>
in my form.ejs, but it throws an error:
Could not find the include file "test.ejs"
So I wondered what was going on and included the absolute Path to the file and voila it works.
I was curious so i included
<%- process.cwd(); %>
into form.ejs and that return the root directory probably because it is being executed from server.js.
So now the question is: How do I get relative paths? Do I have to create a variable at runtime with the root directory and add that to my include paths like this? (even this wouldn't be relative)
const root = process.cwd(); //inside server.js
<%- include(root+'/sites/test.ejs') %>
This seems inelegant. What am I missing? Thanks for your help.
Ok I'm guilty of RTFM: It didn't work before, because i had to set the views option in my ejs.render(str, data, options). With
ejs.render(contents.toString(),null,{views:["./sites"]}); //in server.js
<%- include('test') %> // in form.ejs ('test.ejs' works as well)
It now renders, but still, the path is relative to the one set in views.
Ok that's a workaround and after digging a bit more i found this line from the docs literally a line after what i originally posted:
You must specify the filename option for the template with the
include call unless you are using renderFile().
renderFile() is asynchronous, so that wouldn't work for me. So finally the solution is to modify my original ejs.render function:
html = ejs.render(contents.toString(),null,{filename: ejspath}); //ejspath being the path to the ejs file to render
//contents is the contents of the ejs file
This Method works with paths like ../templates.bar inside of form.ejs
Related
I included layout to my view and also i need to make JS script to load for this view directly in the head. How to do that ?
// view file
<%- layout('/layout/boilerplate.ejs') %>
<script>
// want to load script in the HEAD of my boilerplate file.
</script>
I tried to add head tag and expected it to combined with head in boiler plate but didn`t. Do not want to add to boilerplate because it be downloaded for every route then.
There are a few steps that needs to be followed.
Put your JS files in the /public folder of your project.
Configure the Node server to serve your Static files.
Use a script tag to reference your JS in your ejs file
Hope this will be helpful.
Cheers!!
I wonder how I can insert JS functions into an EJS file?
I have this function:enter image description here
I tried to create a separate .ejs file where I will insert a function between the tags <% %> and also import it into the ЕЈS file that I need, but it doesn't work for me
EJS does not provide a DOM. Output from EJS is generated using <%= and similar.
The document object is only (that's a slight simplification) available in JS running in an HTML document in the browser.
To use that code you would need to include it in a <script> element output from the EJS into an HTML document and run in a browser.
Error: Failed to lookup view "index.ejs" in views directory
You don't need to tell it the extension since the view engine is already set up as EJS. Try changing it to res.render('index'). Also, your index.ejs file name has 2 periods.
Is it ok to set the ejs as a view engine even you don't require the ejs?
I have ASP.NET MVC project and I am using SmartAdmin bootstrap template.
When I run my app and go directly:
http://localhost:8899/smartadmin/public/index.html
then everything works.
But when I return this file (index.html) in this way:
public ActionResult Index()
{
return new FilePathResult("~/smartadmin/public/index.html", "text/html");
}
and run this action I have many errors in console.
It looks like something with paths has changed because files couldn't be found
Paths should always start smartadmin/public/
This problem is also with other files, not only with styles, scripts. Even if I change these paths in index.html and run app, I will again have errors about other files (partial views etc).
I can't change path everywhere - it would be too hard.
It looks like you r using relative paths to you style files. The route to your action should have the same 'depth' as the html file that u use in the return of the action something like, /a/b/c. This is done in routing config in url param.
However, it is best practice to use absolute path in your view.
I have a problem with mvc4 application.
I have created a masterpage with "bundleconfig" for css and js file.
so far so good ... everything works, such as "localhost1234:/Admin/Index" I see everything correctly.
The problem is when I go to the page "localhost1234:/Admin/Edit/2" (2 is user id por update) here does not find references in the file main.js
The file main.js is this:
`
head.js("../assets/js/skin-select/jquery.cookie.js");
head.js("../assets/js/skin-select/skin-select.js");
head.js("../assets/js/clock/date.js");
`
In the error console of the browser says that not found the reference:
404 Not Found - localhost:1234/Admin/assets/js/jquery.cookie.js"
jquery.cookie.js
404 Not Found - localhost:1234/Admin/assets/js/bootstrap.js"
Why he put the name of the view (Admin) front the path in the main.js file ???
Can you help me?
Use Url.Content helper to generate the right path from the relative path like this:
head.js('#Url.Content("~/assets/js/skin-select/jquery.cookie.js")');
Currently it is trying to find in the Admin folder assets--> js-->jquery.cookie.js.
After using Url.Content() it will first get the RootDirectory and the address will be like : http://localhost/assests/js/skin-select/jquery.cookie.js