From c52a41fe29237109584275436f27b8ae5d63ba9a Mon Sep 17 00:00:00 2001 From: Daven <19704779+MSoup@users.noreply.github.com> Date: Sun, 27 Feb 2022 14:06:56 +0900 Subject: [PATCH] Fix class="list-group-item}" to "list-group-item" There are 5 instances where class="list-group-item" has an extra "}", which TypeScript / Linting does not detect. The result is that bootstrap does not pick up on the list-group-item class and does not style the todo list item correctly. --- manuscript/02.ECMAScript2015.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/manuscript/02.ECMAScript2015.md b/manuscript/02.ECMAScript2015.md index f83b244..3f31945 100644 --- a/manuscript/02.ECMAScript2015.md +++ b/manuscript/02.ECMAScript2015.md @@ -100,7 +100,7 @@ If you take a look at the ES5 that this gets compiled down to, it makes a whole Looking at this compiled code with such a simple example also makes this syntax seems a little silly, but it gets a whole lot more interesting when you consider a more real-world example. For instance, let's assume we want to use this chunk of HTML as a template to render the details of a Todo: -
+
[[Name]]
@@ -112,7 +112,7 @@ So, let's avoid all of that by converting this into a string template instead. The first thing to do is wrap the HTML in backticks. container.innerHTML = ` -
+
[[Name]]
@@ -132,7 +132,7 @@ Then, rather than doing those search-and-replace operations, we can insert the v } container.innerHTML = ` -
+
${todo.name}
@@ -143,7 +143,7 @@ One of the cool things about string templates is that you don't have to restrict For example, I can figure out whether or not to render the "hidden" class on the icon element dynamically by introducing a conditional statement right there in the expression, like this: container.innerHTML = ` -
+
${todo.name}
@@ -153,7 +153,7 @@ When the value of todo.completed is true, the expression will evaluate to an emp {title="app.js"} ~~~ -container.innerHTML = "\n\t
\n\t \n\t " + todo.name + "\n\t
\n\t"; +container.innerHTML = "\n\t
\n\t \n\t " + todo.name + "\n\t
\n\t"; ~~~ Once again, inspecting the compiled JavaScript reveals that - even with inline conditional statements and everything - this syntax eventually just ends up as a series of concatenated strings and expressions.