Add transient view-helper demo in Angular 18.

Author: bennadel

README.md

@@ -10,6 +10,7 @@ with.
 
 ## My JavaScript Demos - I Love JavaScript!
 
+* [Creating A Transient View Helper In Angular 18](https://bennadel.github.io/JavaScript-Demos/demos/view-helper-angular18/dist)
 * [Angular 18 Hello World](https://bennadel.github.io/JavaScript-Demos/demos/ng-18-hello-world/dist)
 * [An "x-input" Property Binding Directive In Alpine.js](https://bennadel.github.io/JavaScript-Demos/demos/input-directive-alpine)
 * [Creating A Tri-State Switch In Alpine.js](https://bennadel.github.io/JavaScript-Demos/demos/tri-state-toggle)
@@ -192,7 +193,7 @@ with.
 * [Creating Shortcuts By Mapping Multiple Routes On To The Same View-Component In Angular 7.2.5](https://bennadel.github.io/JavaScript-Demos/demos/url-shortcuts2-view-angular7/)
 * [Using A Wild Card Shortcuts Route To Hide The Internal Routing Implementation In Angular 7.2.5](https://bennadel.github.io/JavaScript-Demos/demos/url-shortcuts-view-angular7/)
 * [Projecting Content Into The Root Application Component Using Slots In Vue.js 2.6.6](https://bennadel.github.io/JavaScript-Demos/demos/projecting-root-content-vue2/)
-* [Using A Wild Card Route (**) To Traverse Arbitrarily Nested Data In Angular 7.2.4](https://bennadel.github.io/JavaScript-Demos/demos/router-folder-like-structure-angular7/)
+* [Using A Wild Card Route (\*\*) To Traverse Arbitrarily Nested Data In Angular 7.2.4](https://bennadel.github.io/JavaScript-Demos/demos/router-folder-like-structure-angular7/)
 * [Trying To Implement 9-Slice Scaling With SVG Components In Angular 7.2.4](https://bennadel.github.io/JavaScript-Demos/demos/svg-9-slice-scaling-angular7/)
 * [Hacking Scoped CSS Modules Into A Brownfield AngularJS 1.2.22 Application](https://bennadel.github.io/JavaScript-Demos/demos/css-modules-angularjs/)
 * [Renderless Components In Angular 7.2.0](https://bennadel.github.io/JavaScript-Demos/demos/renderless-components-angular7/)

demos/view-helper-angular18/.gitignore

@@ -0,0 +1,42 @@
+# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
+
+# Compiled output
+# /dist -- needed since I'm pushing this stuff to GitHub pages.
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+
+# System files
+.DS_Store
+Thumbs.db

demos/view-helper-angular18/angular.json

@@ -0,0 +1,108 @@
+{
+	"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+	"version": 1,
+	"newProjectRoot": "projects",
+	"projects": {
+		"app": {
+			"projectType": "application",
+			"schematics": {
+				"@schematics/angular:component": {
+					"style": "less"
+				}
+			},
+			"root": "",
+			"sourceRoot": "src",
+			"prefix": "app",
+			"architect": {
+				"build": {
+					"builder": "@angular-devkit/build-angular:application",
+					"options": {
+						"outputPath": {
+							"base": "dist",
+							"browser": ""
+						},
+						"index": "src/index.html",
+						"browser": "src/main.ts",
+						"polyfills": [
+							"zone.js"
+						],
+						"tsConfig": "tsconfig.app.json",
+						"inlineStyleLanguage": "less",
+						"assets": [
+							{
+								"glob": "**/*",
+								"input": "public"
+							}
+						],
+						"styles": [
+							"src/styles.less"
+						],
+						"scripts": []
+					},
+					"configurations": {
+						"production": {
+							"budgets": [
+								{
+									"type": "initial",
+									"maximumWarning": "500kB",
+									"maximumError": "1MB"
+								},
+								{
+									"type": "anyComponentStyle",
+									"maximumWarning": "2kB",
+									"maximumError": "4kB"
+								}
+							],
+							"outputHashing": "all"
+						},
+						"development": {
+							"optimization": false,
+							"extractLicenses": false,
+							"sourceMap": true
+						}
+					},
+					"defaultConfiguration": "production"
+				},
+				"serve": {
+					"builder": "@angular-devkit/build-angular:dev-server",
+					"configurations": {
+						"production": {
+							"buildTarget": "app:build:production"
+						},
+						"development": {
+							"buildTarget": "app:build:development"
+						}
+					},
+					"defaultConfiguration": "development"
+				},
+				"extract-i18n": {
+					"builder": "@angular-devkit/build-angular:extract-i18n"
+				},
+				"test": {
+					"builder": "@angular-devkit/build-angular:karma",
+					"options": {
+						"polyfills": [
+							"zone.js",
+							"zone.js/testing"
+						],
+						"tsConfig": "tsconfig.spec.json",
+						"inlineStyleLanguage": "less",
+						"assets": [
+							{
+								"glob": "**/*",
+								"input": "public"
+							}
+						],
+						"styles": [
+							"src/styles.less"
+						],
+						"scripts": []
+					}
+				}
+			}
+		}
+	},
+	"cli": {
+		"analytics": "2168fbca-b81d-47f4-a129-d9947dd3c82c"
+	}
+}