Difference between 'app.settings.title' and 'settings.title' - node.js

If I set the following in my app.js file, why can't I access it using app.settings.title rather than settings.title in my rendered view? It seems I cannot prefix it with the app object.
...
app.set('title','TestApplication');
...
Why must I do this,
<!DOCTYPE html>
<html lang='en'>
<head>
<title><%= settings.title %></title>
</head>
<body>
</body>
</html>
rather than this?
<!DOCTYPE html>
<html lang='en'>
<head>
<title><%= app.settings.title %></title>
</head>
<body>
</body>
</html>
There is probably a simply answer to this question, but I am new to Javascript and am trying to learn Expressjs and Nodejs.
Thanks

Because variable is extracted before getting to view.

Because express provides some abstraction at the view level. It would be redundant and potentially insecure to expose app to your view, and so it's abstracted away so that you can just directly access settings.

Related

chrome.tts.speak has undefined properties when used in service worker

I'm trying to add a sound to my chrome extension. It is my understanding it must be done in a service worker and that is where I have it:
chrome.tts.speak("Hit has been queued",{"lang": "en-US","rate":2.0});
However, when this executes I get this error:
caught error - Cannot read properties of undefined (reading 'speak')
It almost looks like a syntax error in the argument list but I don't see it. Can someone spot what I'm doing wrong? TIA
Updated HTML page without running as an extension
<!doctype html>
<html lang="en">
<head>
<title>
Alert
</title>
</head>
<body>
<script>
chrome.tts.speak("Hit added to queue",{"lang":"US-en","rate":2.0});
</script>
</body>
</html>
Updated per suggestion
alert.html
<!doctype html>
<html lang="en">
<head>
<title>
Alert
</title>
</head>
<body>
<script type="application/x-javascript" src="alert.js">
</script>
</body>
</html>
alert.js
chrome.tts.speak("Hit added to queue",{"lang":"US-en","rate":2.0});

Using #local_variable in CSHTML code in asp-page

I develop ASP.Net Core 2.1 RazorPages web application. I want parametrize the the value of asp-page tag helper.
So I use following code in cshtml file. There is a del_link local variable defined in begining of file. This variable is late used as parameter for second asp-page tag helper.
#page
#{
string del_link = "/UnloadDelete";
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div>
<a asp-page="/UnloadEdit">Details</a>
<a asp-page=#del_link>Delete</a>
</div>
</body>
</html>
ASP.Net Razor generate following HTML code.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<div>
Details
Delete
</div>
</body>
</html>
As you can see in HTML code, asp-page="/UnloadEdit" is properly rendered to HTML code, but asp-page=#del not, it is rendered to <a href="">. How I can use local variable for asp-page tag helper in Razor Pages?
Thanks in advance.
You must pass a page name to the asp-page attribute. So what you are trying to do is not supported. If #del_link renders a relative URL, you can pass that to the href attribute instead. There may be other suitable solutions, depending on why you feel the need to use #del_link at all.

SublimeText - typing "html" + {TAB} just returns HTML, not full default tags

I just installed Emmet, and when I type html TAB I only get
<html></html>
Before then, when I did so, Sublimetext would create all the default tags:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Is there a setting or something I can update in Emmet, or Sublime text so that when I have Emmet enabled, I can get the "full" tags?
The file is a .html file, and it's set to HTML in Sublime.
Here's a quick .gif - I start with Emmet diabled:
In Sublime Text 3 it's
html:5 + tab
Returns:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
In Sublime Text 3 you can type <h, and you will get
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Also you should make document type HTML
on mine, html + TAB gives me what you're getting, but if I do html + ENTER, then I get the entire boilerplate.

Including an html file into another html file using Handlebars.js

In PHP, it's easy to include a file in another one to avoid redundancy of the code using the include keyword. Is there a similar solution in Node.JS using Handlebars.JS?
From your question it sounds like you are looking for handlebars partials. For an example check out https://github.com/donpark/hbs/tree/master/examples/partial.
In short, you'd have something which looked like:
index.hbs:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Your Website</title>
</head>
<body>
{{> header}}
</body>
</html>
where {{> header}} is referencing the header.hbs partial.

Adding extra scripts and headers to ufront-erazor html layout

Using ufront and erazor I ran into the following problem very quickly.
The hello-world example provides the following layout:
<!DOCTYPE html>
<html lang="en">
<head>
<title>#title</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
#viewContent
</div>
</body>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"</script>
</html>
For certain pages I want to add more headers or scripts after Jquery has been loaded.
One way to do so (for the scripts for example), would be to pass the scripts as an array of strings, and construct them on the layout file :
...
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"</script>
#for(script in scripts) {
<script src='#script.path'></script>
}
</html>
....
The problem with this approach is that I can't keep meaningful headers + body + scripts on the same template file witch would be great, also needs extra care to pass the scripts and headers as context.
Some template engines like Razor or Laravel allow to do that using 'sections'.
Is it possible to do something similar with erazor? If not what would be a good alternative?

Resources