Angular.js SPA app under Visual Studio and Asp.Net
How to create a simple Asp.Net Core application with Angular.js as frontend.
Angular as SPA
The Angular application in this case is a SPA Single Page Application.
This means that virtually the complete MVC model, the views and the controller are managed in the Angular code. At startup, Angular is embedded in Asp.Net Core and called ClientApp
The web application will start under /ClientApp/index.html.
Main.ts is loaded as TypeScript as code page and is linked to the HTML front page.
Angular.js as a script
Angular.js can only be partially embedded as a javascript-library and, like jQuery, can perform more complex functions and operations.
Angular in Visual Studio 2017 and Asp.net Core
Preparation:
Install Node.js
For Angular.js to run as a web application, Node.js must first be installed on the machine.
Under https://nodejs.org/en/download/
For Windows 10, select the Windows Installer-> Windows Intaller (.msi) 64-bit
And after the download start the installation
Default installation directory for node.js is C: \ Program Files \ nodejs \
In Custom Setup leave all components enabled
Install the core Node.js runtime (node.exe)
Create Asp-Core project with Angular SPA frontend
In Visual Studio 2017
In Visual Studio, go to Menu-> File-> New Project
.Net Core or Web
And then choose ASP.NET Core Web Application
Project Template
Then you can under Asp.Net Core 2.1 also select the template: Angular
A project template for creating Asp.Net Core application with Angular
Change Authentication does not change this template
First access:
When starting the first web application, the Windows Defender queries whether Node.js is allowed to execute the server-side Javascript.
Then Angular.js can be started as a web application at https: // localhost: 44390
Manual:
For Visual Studio 2015/2017 you can find a detailed introduction at https://angular.io/guide/visual-studio-2015
Download the QuickStart source from GitHub