This component demonstrates fetching data from the server.
4 |
5 |
Loading...
6 |
7 |
8 |
9 |
10 |
Date
11 |
Temp. (C)
12 |
Temp. (F)
13 |
Summary
14 |
15 |
16 |
17 |
18 |
{{ forecast.date }}
19 |
{{ forecast.temperatureC }}
20 |
{{ forecast.temperatureF }}
21 |
{{ forecast.summary }}
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/ClientApp/.browserslistrc:
--------------------------------------------------------------------------------
1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
2 | # For additional information regarding the format and rule options, please see:
3 | # https://github.com/browserslist/browserslist#queries
4 |
5 | # For the full list of supported browsers by the Angular framework, please see:
6 | # https://angular.io/guide/browser-support
7 |
8 | # You can see what browsers were selected by your queries by running:
9 | # npx browserslist
10 |
11 | last 1 Chrome version
12 | last 1 Firefox version
13 | last 2 Edge major versions
14 | last 2 Safari major versions
15 | last 2 iOS major versions
16 | Firefox ESR
17 | not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.
18 |
--------------------------------------------------------------------------------
/Dockerfile:
--------------------------------------------------------------------------------
1 | FROM mcr.microsoft.com/dotnet/aspnet:6.0 AS base
2 | WORKDIR /app
3 | EXPOSE 80
4 | EXPOSE 443
5 |
6 | FROM mcr.microsoft.com/dotnet/sdk:6.0 AS build
7 |
8 | # Install Node.js
9 | RUN curl -fsSL https://deb.nodesource.com/setup_14.x | bash - \
10 | && apt-get install -y \
11 | nodejs \
12 | && rm -rf /var/lib/apt/lists/*
13 |
14 | WORKDIR /src
15 | COPY ["ASP.NETCoreWithAngular.csproj", "./"]
16 | RUN dotnet restore "ASP.NETCoreWithAngular.csproj"
17 | COPY . .
18 | WORKDIR "/src/"
19 | RUN dotnet build "ASP.NETCoreWithAngular.csproj" -c Release -o /app/build
20 |
21 | FROM build AS publish
22 | RUN dotnet publish "ASP.NETCoreWithAngular.csproj" -c Release -o /app/publish
23 |
24 | FROM base AS final
25 | WORKDIR /app
26 | COPY --from=publish /app/publish .
27 | ENTRYPOINT ["dotnet", "ASP.NETCoreWithAngular.dll"]
28 |
--------------------------------------------------------------------------------
/ClientApp/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compileOnSave": false,
3 | "compilerOptions": {
4 | "baseUrl": "./",
5 | "outDir": "./dist/out-tsc",
6 | "forceConsistentCasingInFileNames": true,
7 | "strict": true,
8 | "noImplicitReturns": true,
9 | "noFallthroughCasesInSwitch": true,
10 | "sourceMap": true,
11 | "declaration": false,
12 | "downlevelIteration": true,
13 | "experimentalDecorators": true,
14 | "moduleResolution": "node",
15 | "importHelpers": true,
16 | "target": "es2017",
17 | "module": "es2020",
18 | "lib": [
19 | "es2018",
20 | "dom"
21 | ]
22 | },
23 | "angularCompilerOptions": {
24 | "enableI18nLegacyMessageIdFormat": false,
25 | "strictInjectionParameters": true,
26 | "strictInputAccessModifiers": true,
27 | "strictTemplates": true
28 | }
29 | }
30 |
--------------------------------------------------------------------------------
/ClientApp/src/test.ts:
--------------------------------------------------------------------------------
1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files
2 |
3 | import 'zone.js/testing';
4 | import { getTestBed } from '@angular/core/testing';
5 | import {
6 | BrowserDynamicTestingModule,
7 | platformBrowserDynamicTesting
8 | } from '@angular/platform-browser-dynamic/testing';
9 |
10 | declare const require: {
11 | context(path: string, deep?: boolean, filter?: RegExp): {
12 | keys(): string[];
13 | (id: string): T;
14 | };
15 | };
16 |
17 | // First, initialize the Angular testing environment.
18 | getTestBed().initTestEnvironment(
19 | BrowserDynamicTestingModule,
20 | platformBrowserDynamicTesting()
21 | );
22 | // Then we find all the tests.
23 | const context = require.context('./', true, /\.spec\.ts$/);
24 | // And load the modules.
25 | context.keys().map(context);
26 |
--------------------------------------------------------------------------------
/ASP.NETCoreWithAngular.sln:
--------------------------------------------------------------------------------
1 |
2 | Microsoft Visual Studio Solution File, Format Version 12.00
3 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "ASP.NETCoreWithAngular", "ASP.NETCoreWithAngular.csproj", "{5D36796C-3FE9-4AC5-8653-7D071F3D3E7D}"
4 | EndProject
5 | Global
6 | GlobalSection(SolutionConfigurationPlatforms) = preSolution
7 | Debug|Any CPU = Debug|Any CPU
8 | Release|Any CPU = Release|Any CPU
9 | EndGlobalSection
10 | GlobalSection(ProjectConfigurationPlatforms) = postSolution
11 | {5D36796C-3FE9-4AC5-8653-7D071F3D3E7D}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
12 | {5D36796C-3FE9-4AC5-8653-7D071F3D3E7D}.Debug|Any CPU.Build.0 = Debug|Any CPU
13 | {5D36796C-3FE9-4AC5-8653-7D071F3D3E7D}.Release|Any CPU.ActiveCfg = Release|Any CPU
14 | {5D36796C-3FE9-4AC5-8653-7D071F3D3E7D}.Release|Any CPU.Build.0 = Release|Any CPU
15 | EndGlobalSection
16 | EndGlobal
17 |
--------------------------------------------------------------------------------
/Properties/launchSettings.json:
--------------------------------------------------------------------------------
1 | {
2 | "iisSettings": {
3 | "windowsAuthentication": false,
4 | "anonymousAuthentication": true,
5 | "iisExpress": {
6 | "applicationUrl": "http://localhost:57042",
7 | "sslPort": 44385
8 | }
9 | },
10 | "profiles": {
11 | "ASP.NETCoreWithAngular": {
12 | "commandName": "Project",
13 | "launchBrowser": true,
14 | "applicationUrl": "https://localhost:7260;http://localhost:5260",
15 | "environmentVariables": {
16 | "ASPNETCORE_ENVIRONMENT": "Development",
17 | "ASPNETCORE_HOSTINGSTARTUPASSEMBLIES": "Microsoft.AspNetCore.SpaProxy"
18 | }
19 | },
20 | "IIS Express": {
21 | "commandName": "IISExpress",
22 | "launchBrowser": true,
23 | "environmentVariables": {
24 | "ASPNETCORE_ENVIRONMENT": "Development",
25 | "ASPNETCORE_HOSTINGSTARTUPASSEMBLIES": "Microsoft.AspNetCore.SpaProxy"
26 | }
27 | }
28 | }
29 | }
30 |
--------------------------------------------------------------------------------
/Controllers/WeatherForecastController.cs:
--------------------------------------------------------------------------------
1 | using Microsoft.AspNetCore.Mvc;
2 |
3 | namespace ASP.NETCoreWithAngular.Controllers;
4 |
5 | [ApiController]
6 | [Route("[controller]")]
7 | public class WeatherForecastController : ControllerBase
8 | {
9 | private static readonly string[] Summaries = new[]
10 | {
11 | "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
12 | };
13 |
14 | private readonly ILogger _logger;
15 |
16 | public WeatherForecastController(ILogger logger)
17 | {
18 | _logger = logger;
19 | }
20 |
21 | [HttpGet]
22 | public IEnumerable Get()
23 | {
24 | return Enumerable.Range(1, 5).Select(index => new WeatherForecast
25 | {
26 | Date = DateTime.Now.AddDays(index),
27 | TemperatureC = Random.Shared.Next(-20, 55),
28 | Summary = Summaries[Random.Shared.Next(Summaries.Length)]
29 | })
30 | .ToArray();
31 | }
32 | }
--------------------------------------------------------------------------------
/ClientApp/src/app/home/home.component.html:
--------------------------------------------------------------------------------
1 |
Hello, world!
2 |
Welcome to your new single-page application, built with ASP.NET Core & Angular:
3 |
4 |
To help you get started, we've also set up:
5 |
6 |
Client-side navigation. For example, click Counter then Back to return here.
7 |
Angular CLI integration. In development mode, there's no need to run ng serve. It runs in the background automatically, so your client-side resources are dynamically built on demand and the page refreshes when you modify any file.
8 |
Efficient production builds. In production mode, development-time features are disabled, and your dotnet publish configuration automatically invokes ng build to produce minified, ahead-of-time compiled JavaScript files.
9 |
10 |
The ClientApp subdirectory is a standard Angular CLI application. If you open a command prompt in that directory, you can run any ng command (e.g., ng test), or use npm to install extra packages into it.
11 |
--------------------------------------------------------------------------------
/ClientApp/README.md:
--------------------------------------------------------------------------------
1 | # ASP.NETCoreWithAngular
2 |
3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.0.2.
4 |
5 | ## Development server
6 |
7 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
8 |
9 | ## Code scaffolding
10 |
11 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
12 |
13 | ## Build
14 |
15 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
16 |
17 | ## Running unit tests
18 |
19 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
20 |
21 | ## Running end-to-end tests
22 |
23 | Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
24 |
25 | ## Further help
26 |
27 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
28 |
--------------------------------------------------------------------------------
/ClientApp/src/app/counter/counter.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2 |
3 | import { CounterComponent } from './counter.component';
4 |
5 | describe('CounterComponent', () => {
6 | let fixture: ComponentFixture;
7 |
8 | beforeEach(async(() => {
9 | TestBed.configureTestingModule({
10 | declarations: [ CounterComponent ]
11 | })
12 | .compileComponents();
13 | }));
14 |
15 | beforeEach(() => {
16 | fixture = TestBed.createComponent(CounterComponent);
17 | fixture.detectChanges();
18 | });
19 |
20 | it('should display a title', async(() => {
21 | const titleText = fixture.nativeElement.querySelector('h1').textContent;
22 | expect(titleText).toEqual('Counter');
23 | }));
24 |
25 | it('should start with count 0, then increments by 1 when clicked', async(() => {
26 | const countElement = fixture.nativeElement.querySelector('strong');
27 | expect(countElement.textContent).toEqual('0');
28 |
29 | const incrementButton = fixture.nativeElement.querySelector('button');
30 | incrementButton.click();
31 | fixture.detectChanges();
32 | expect(countElement.textContent).toEqual('1');
33 | }));
34 | });
35 |
--------------------------------------------------------------------------------
/ClientApp/src/app/app.module.ts:
--------------------------------------------------------------------------------
1 | import { BrowserModule } from '@angular/platform-browser';
2 | import { NgModule } from '@angular/core';
3 | import { FormsModule } from '@angular/forms';
4 | import { HttpClientModule } from '@angular/common/http';
5 | import { RouterModule } from '@angular/router';
6 |
7 | import { AppComponent } from './app.component';
8 | import { NavMenuComponent } from './nav-menu/nav-menu.component';
9 | import { HomeComponent } from './home/home.component';
10 | import { CounterComponent } from './counter/counter.component';
11 | import { FetchDataComponent } from './fetch-data/fetch-data.component';
12 |
13 | @NgModule({
14 | declarations: [
15 | AppComponent,
16 | NavMenuComponent,
17 | HomeComponent,
18 | CounterComponent,
19 | FetchDataComponent
20 | ],
21 | imports: [
22 | BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
23 | HttpClientModule,
24 | FormsModule,
25 | RouterModule.forRoot([
26 | { path: '', component: HomeComponent, pathMatch: 'full' },
27 | { path: 'counter', component: CounterComponent },
28 | { path: 'fetch-data', component: FetchDataComponent },
29 | ])
30 | ],
31 | providers: [],
32 | bootstrap: [AppComponent]
33 | })
34 | export class AppModule { }
35 |
--------------------------------------------------------------------------------
/ClientApp/aspnetcore-https.js:
--------------------------------------------------------------------------------
1 | // This script sets up HTTPS for the application using the ASP.NET Core HTTPS certificate
2 | const fs = require('fs');
3 | const spawn = require('child_process').spawn;
4 | const path = require('path');
5 |
6 | const baseFolder =
7 | process.env.APPDATA !== undefined && process.env.APPDATA !== ''
8 | ? `${process.env.APPDATA}/ASP.NET/https`
9 | : `${process.env.HOME}/.aspnet/https`;
10 |
11 | const certificateArg = process.argv.map(arg => arg.match(/--name=(?.+)/i)).filter(Boolean)[0];
12 | const certificateName = certificateArg ? certificateArg.groups.value : process.env.npm_package_name;
13 |
14 | if (!certificateName) {
15 | console.error('Invalid certificate name. Run this script in the context of an npm/yarn script or pass --name=<> explicitly.')
16 | process.exit(-1);
17 | }
18 |
19 | const certFilePath = path.join(baseFolder, `${certificateName}.pem`);
20 | const keyFilePath = path.join(baseFolder, `${certificateName}.key`);
21 |
22 | if (!fs.existsSync(certFilePath) || !fs.existsSync(keyFilePath)) {
23 | spawn('dotnet', [
24 | 'dev-certs',
25 | 'https',
26 | '--export-path',
27 | certFilePath,
28 | '--format',
29 | 'Pem',
30 | '--no-password',
31 | ], { stdio: 'inherit', })
32 | .on('exit', (code) => process.exit(code));
33 | }
34 |
--------------------------------------------------------------------------------
/ClientApp/karma.conf.js:
--------------------------------------------------------------------------------
1 | // Karma configuration file, see link for more information
2 | // https://karma-runner.github.io/1.0/config/configuration-file.html
3 |
4 | module.exports = function (config) {
5 | config.set({
6 | basePath: '',
7 | frameworks: ['jasmine', '@angular-devkit/build-angular'],
8 | plugins: [
9 | require('karma-jasmine'),
10 | require('karma-chrome-launcher'),
11 | require('karma-jasmine-html-reporter'),
12 | require('karma-coverage'),
13 | require('@angular-devkit/build-angular/plugins/karma')
14 | ],
15 | client: {
16 | jasmine: {
17 | // you can add configuration options for Jasmine here
18 | // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
19 | // for example, you can disable the random execution with `random: false`
20 | // or set a specific seed with `seed: 4321`
21 | },
22 | clearContext: false // leave Jasmine Spec Runner output visible in browser
23 | },
24 | jasmineHtmlReporter: {
25 | suppressAll: true // removes the duplicated traces
26 | },
27 | coverageReporter: {
28 | dir: require('path').join(__dirname, './coverage/angularapp'),
29 | subdir: '.',
30 | reporters: [
31 | { type: 'html' },
32 | { type: 'text-summary' }
33 | ]
34 | },
35 | reporters: ['progress', 'kjhtml'],
36 | port: 9876,
37 | colors: true,
38 | logLevel: config.LOG_INFO,
39 | autoWatch: true,
40 | browsers: ['Chrome'],
41 | singleRun: false,
42 | restartOnFileChange: true
43 | });
44 | };
45 |
--------------------------------------------------------------------------------
/ClientApp/src/app/nav-menu/nav-menu.component.html:
--------------------------------------------------------------------------------
1 |
2 |
44 |
45 |
--------------------------------------------------------------------------------
/ClientApp/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "asp.netcorewithangular",
3 | "version": "0.0.0",
4 | "scripts": {
5 | "ng": "ng",
6 | "prestart": "node aspnetcore-https",
7 | "start": "run-script-os",
8 | "start:windows": "ng serve --port 44485 --ssl --ssl-cert %APPDATA%\\ASP.NET\\https\\%npm_package_name%.pem --ssl-key %APPDATA%\\ASP.NET\\https\\%npm_package_name%.key",
9 | "start:default": "ng serve --port 44485 --ssl --ssl-cert $HOME/.aspnet/https/${npm_package_name}.pem --ssl-key $HOME/.aspnet/https/${npm_package_name}.key",
10 | "build": "ng build",
11 | "build:ssr": "ng run ASP.NETCoreWithAngular:server:dev",
12 | "watch": "ng build --watch --configuration development",
13 | "test": "ng test"
14 | },
15 | "private": true,
16 | "dependencies": {
17 | "@angular/animations": "~12.2.2",
18 | "@angular/common": "~12.2.2",
19 | "@angular/compiler": "~12.2.2",
20 | "@angular/core": "~12.2.2",
21 | "@angular/forms": "~12.2.2",
22 | "@angular/platform-browser": "~12.2.2",
23 | "@angular/platform-browser-dynamic": "~12.2.2",
24 | "@angular/platform-server": "~12.2.2",
25 | "@angular/router": "~12.2.2",
26 | "bootstrap": "^5.1.0",
27 | "jquery": "^3.5.1",
28 | "oidc-client": "^1.11.5",
29 | "popper.js": "^1.16.0",
30 | "run-script-os": "^1.1.6",
31 | "rxjs": "~6.6.0",
32 | "tslib": "^2.1.0",
33 | "zone.js": "~0.11.4"
34 | },
35 | "devDependencies": {
36 | "@angular-devkit/build-angular": "~12.2.2",
37 | "@angular/cli": "~12.2.2",
38 | "@angular/compiler-cli": "~12.2.2",
39 | "@types/jasmine": "~3.6.0",
40 | "@types/jasminewd2": "~2.0.8",
41 | "@types/node": "^12.11.1",
42 | "jasmine-core": "~3.8.0",
43 | "karma": "~6.3.0",
44 | "karma-chrome-launcher": "~3.1.0",
45 | "karma-coverage": "~2.0.3",
46 | "karma-jasmine": "~4.0.0",
47 | "karma-jasmine-html-reporter": "^1.5.0",
48 | "typescript": "~4.2.3"
49 | },
50 | "optionalDependencies": {}
51 | }
52 |
--------------------------------------------------------------------------------
/ClientApp/src/app/fetch-data/fetch-data.component.ts:
--------------------------------------------------------------------------------
1 | import {
2 | Inject, Component,
3 | AfterViewInit,
4 | AfterContentInit,
5 | DoCheck,
6 | OnInit,
7 | AfterContentChecked,
8 | OnDestroy, OnChanges, AfterViewChecked
9 | } from '@angular/core';
10 | import { HttpClient } from '@angular/common/http';
11 |
12 | @Component({
13 | selector: 'app-fetch-data',
14 | templateUrl: './fetch-data.component.html'
15 | })
16 | export class FetchDataComponent implements
17 | OnInit, DoCheck, OnChanges,
18 | AfterContentInit, AfterContentChecked,
19 | AfterViewInit, AfterContentChecked,
20 | AfterViewChecked, OnDestroy {
21 | public forecasts: WeatherForecast[] = [];
22 |
23 | constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
24 | http.get(baseUrl + 'weatherforecast').subscribe(result => {
25 | this.forecasts = result;
26 | }, error => console.error(error));
27 | }
28 |
29 | //create methods of all life cycles of angular
30 | ngOnChanges() {
31 | //Called before ngOnInit() (if the component has bound inputs) and whenever one or more data-bound input properties change.
32 | //Note that if your component has no inputs or you use it without providing any inputs, the framework will not call ngOnChanges().
33 | }
34 |
35 | ngOnInit() {
36 | // Called once, after the first ngOnChanges(). ngOnInit() is still called even when ngOnChanges() is not
37 | // (which is the case when there are no template-bound inputs).
38 | }
39 |
40 |
41 | ngDoCheck() {
42 | // Called immediately after ngOnChanges() on every change detection run, and immediately after ngOnInit() on the first run.
43 | }
44 |
45 | ngAfterContentInit() {
46 | // Called once after the first ngDoCheck().
47 | }
48 |
49 | ngAfterContentChecked() {
50 | // Called after ngAfterContentInit() and every subsequent ngDoCheck().
51 | }
52 |
53 | ngAfterViewInit() {
54 | // Called once after the first ngAfterContentChecked().
55 | }
56 |
57 | ngAfterViewChecked() {
58 | // Called after the ngAfterViewInit() and every subsequent ngAfterContentChecked().
59 | }
60 |
61 | ngOnDestroy() {
62 | // Called immediately before Angular destroys the directive or component.
63 | }
64 |
65 | }
66 |
67 | interface WeatherForecast {
68 | date: string;
69 | temperatureC: number;
70 | temperatureF: number;
71 | summary: string;
72 | }
73 |
--------------------------------------------------------------------------------
/ASP.NETCoreWithAngular.csproj:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | net6.0
5 | enable
6 | false
7 | ClientApp\
8 | https://localhost:44485
9 | npm start
10 | enable
11 | Linux
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 | <_ContentIncludedByDefault Remove="Pages\Error.cshtml" />
27 | <_ContentIncludedByDefault Remove="Pages\_ViewImports.cshtml" />
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | wwwroot\%(RecursiveDir)%(FileName)%(Extension)
50 | PreserveNewest
51 | true
52 |
53 |
54 |
55 |
56 |
--------------------------------------------------------------------------------
/ClientApp/src/polyfills.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * This file includes polyfills needed by Angular and is loaded before the app.
3 | * You can add your own extra polyfills to this file.
4 | *
5 | * This file is divided into 2 sections:
6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main
8 | * file.
9 | *
10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
13 | *
14 | * Learn more in https://angular.io/guide/browser-support
15 | */
16 |
17 | /***************************************************************************************************
18 | * BROWSER POLYFILLS
19 | */
20 |
21 | /**
22 | * IE11 requires the following for NgClass support on SVG elements
23 | */
24 | // import 'classlist.js'; // Run `npm install --save classlist.js`.
25 |
26 | /**
27 | * Web Animations `@angular/platform-browser/animations`
28 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
29 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
30 | */
31 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`.
32 |
33 | /**
34 | * By default, zone.js will patch all possible macroTask and DomEvents
35 | * user can disable parts of macroTask/DomEvents patch by setting following flags
36 | * because those flags need to be set before `zone.js` being loaded, and webpack
37 | * will put import in the top of bundle, so user need to create a separate file
38 | * in this directory (for example: zone-flags.ts), and put the following flags
39 | * into that file, and then add the following code before importing zone.js.
40 | * import './zone-flags';
41 | *
42 | * The flags allowed in zone-flags.ts are listed here.
43 | *
44 | * The following flags will work for all browsers.
45 | *
46 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
47 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
48 | * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
49 | *
50 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
51 | * with the following flag, it will bypass `zone.js` patch for IE/Edge
52 | *
53 | * (window as any).__Zone_enable_cross_context_check = true;
54 | *
55 | */
56 |
57 | /***************************************************************************************************
58 | * Zone JS is required by default for Angular itself.
59 | */
60 | import 'zone.js'; // Included with Angular CLI.
61 |
62 |
63 | /***************************************************************************************************
64 | * APPLICATION IMPORTS
65 | */
66 |
--------------------------------------------------------------------------------
/ClientApp/angular.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3 | "cli": {
4 | "analytics": "98f42e71-6455-486b-8e5c-7447a1a3571e"
5 | },
6 | "version": 1,
7 | "newProjectRoot": "projects",
8 | "projects": {
9 | "ASP.NETCoreWithAngular": {
10 | "projectType": "application",
11 | "schematics": {
12 | "@schematics/angular:application": {
13 | "strict": true
14 | }
15 | },
16 | "root": "",
17 | "sourceRoot": "src",
18 | "prefix": "app",
19 | "architect": {
20 | "build": {
21 | "builder": "@angular-devkit/build-angular:browser",
22 | "options": {
23 | "progress": false,
24 | "outputPath": "dist",
25 | "index": "src/index.html",
26 | "main": "src/main.ts",
27 | "polyfills": "src/polyfills.ts",
28 | "tsConfig": "tsconfig.app.json",
29 | "assets": [
30 | "src/assets"
31 | ],
32 | "styles": [
33 | "node_modules/bootstrap/dist/css/bootstrap.min.css",
34 | "src/styles.css"
35 | ],
36 | "scripts": []
37 | },
38 | "configurations": {
39 | "production": {
40 | "budgets": [
41 | {
42 | "type": "initial",
43 | "maximumWarning": "500kb",
44 | "maximumError": "1mb"
45 | },
46 | {
47 | "type": "anyComponentStyle",
48 | "maximumWarning": "2kb",
49 | "maximumError": "4kb"
50 | }
51 | ],
52 | "fileReplacements": [
53 | {
54 | "replace": "src/environments/environment.ts",
55 | "with": "src/environments/environment.prod.ts"
56 | }
57 | ],
58 | "outputHashing": "all"
59 | },
60 | "development": {
61 | "buildOptimizer": false,
62 | "optimization": false,
63 | "vendorChunk": true,
64 | "extractLicenses": false,
65 | "sourceMap": true,
66 | "namedChunks": true
67 | }
68 | },
69 | "defaultConfiguration": "production"
70 | },
71 | "serve": {
72 | "builder": "@angular-devkit/build-angular:dev-server",
73 | "configurations": {
74 | "production": {
75 | "browserTarget": "ASP.NETCoreWithAngular:build:production"
76 | },
77 | "development": {
78 | "browserTarget": "ASP.NETCoreWithAngular:build:development",
79 | "proxyConfig": "proxy.conf.js"
80 | }
81 | },
82 | "defaultConfiguration": "development"
83 | },
84 | "extract-i18n": {
85 | "builder": "@angular-devkit/build-angular:extract-i18n",
86 | "options": {
87 | "browserTarget": "ASP.NETCoreWithAngular:build"
88 | }
89 | },
90 | "test": {
91 | "builder": "@angular-devkit/build-angular:karma",
92 | "options": {
93 | "main": "src/test.ts",
94 | "polyfills": "src/polyfills.ts",
95 | "tsConfig": "tsconfig.spec.json",
96 | "karmaConfig": "karma.conf.js",
97 | "assets": [
98 | "src/assets"
99 | ],
100 | "styles": [
101 | "src/styles.css"
102 | ],
103 | "scripts": []
104 | }
105 | },
106 | "server": {
107 | "builder": "@angular-devkit/build-angular:server",
108 | "options": {
109 | "outputPath": "dist-server",
110 | "main": "src/main.ts",
111 | "tsConfig": "tsconfig.server.json"
112 | },
113 | "configurations": {
114 | "dev": {
115 | "optimization": true,
116 | "outputHashing": "all",
117 | "sourceMap": false,
118 | "namedChunks": false,
119 | "extractLicenses": true,
120 | "vendorChunk": true
121 | },
122 | "production": {
123 | "optimization": true,
124 | "outputHashing": "all",
125 | "sourceMap": false,
126 | "namedChunks": false,
127 | "extractLicenses": true,
128 | "vendorChunk": false
129 | }
130 | }
131 | }
132 | }
133 | }
134 | },
135 | "defaultProject": "ASP.NETCoreWithAngular"
136 | }
137 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | ## Ignore Visual Studio temporary files, build results, and
2 | ## files generated by popular Visual Studio add-ons.
3 |
4 | # User-specific files
5 | *.suo
6 | *.user
7 | *.userosscache
8 | *.sln.docstates
9 |
10 | # User-specific files (MonoDevelop/Xamarin Studio)
11 | *.userprefs
12 |
13 | # Build results
14 | [Dd]ebug/
15 | [Dd]ebugPublic/
16 | [Rr]elease/
17 | [Rr]eleases/
18 | x64/
19 | x86/
20 | build/
21 | bld/
22 | bin/
23 | Bin/
24 | obj/
25 | Obj/
26 |
27 | # Visual Studio 2015 cache/options directory
28 | .vs/
29 |
30 | # MSTest test Results
31 | [Tt]est[Rr]esult*/
32 | [Bb]uild[Ll]og.*
33 |
34 | # NUNIT
35 | *.VisualState.xml
36 | TestResult.xml
37 |
38 | # Build Results of an ATL Project
39 | [Dd]ebugPS/
40 | [Rr]eleasePS/
41 | dlldata.c
42 |
43 | *_i.c
44 | *_p.c
45 | *_i.h
46 | *.ilk
47 | *.meta
48 | *.obj
49 | *.pch
50 | *.pdb
51 | *.pgc
52 | *.pgd
53 | *.rsp
54 | *.sbr
55 | *.tlb
56 | *.tli
57 | *.tlh
58 | *.tmp
59 | *.tmp_proj
60 | *.log
61 | *.vspscc
62 | *.vssscc
63 | .builds
64 | *.pidb
65 | *.svclog
66 | *.scc
67 |
68 | # Chutzpah Test files
69 | _Chutzpah*
70 |
71 | # Visual C++ cache files
72 | ipch/
73 | *.aps
74 | *.ncb
75 | *.opendb
76 | *.opensdf
77 | *.sdf
78 | *.cachefile
79 |
80 | # Visual Studio profiler
81 | *.psess
82 | *.vsp
83 | *.vspx
84 | *.sap
85 |
86 | # TFS 2012 Local Workspace
87 | $tf/
88 |
89 | # Guidance Automation Toolkit
90 | *.gpState
91 |
92 | # ReSharper is a .NET coding add-in
93 | _ReSharper*/
94 | *.[Rr]e[Ss]harper
95 | *.DotSettings.user
96 |
97 | # JustCode is a .NET coding add-in
98 | .JustCode
99 |
100 | # TeamCity is a build add-in
101 | _TeamCity*
102 |
103 | # DotCover is a Code Coverage Tool
104 | *.dotCover
105 |
106 | # NCrunch
107 | _NCrunch_*
108 | .*crunch*.local.xml
109 | nCrunchTemp_*
110 |
111 | # MightyMoose
112 | *.mm.*
113 | AutoTest.Net/
114 |
115 | # Web workbench (sass)
116 | .sass-cache/
117 |
118 | # Installshield output folder
119 | [Ee]xpress/
120 |
121 | # DocProject is a documentation generator add-in
122 | DocProject/buildhelp/
123 | DocProject/Help/*.HxT
124 | DocProject/Help/*.HxC
125 | DocProject/Help/*.hhc
126 | DocProject/Help/*.hhk
127 | DocProject/Help/*.hhp
128 | DocProject/Help/Html2
129 | DocProject/Help/html
130 |
131 | # Click-Once directory
132 | publish/
133 |
134 | # Publish Web Output
135 | *.[Pp]ublish.xml
136 | *.azurePubxml
137 | # TODO: Comment the next line if you want to checkin your web deploy settings
138 | # but database connection strings (with potential passwords) will be unencrypted
139 | *.pubxml
140 | *.publishproj
141 |
142 | # NuGet Packages
143 | *.nupkg
144 | # The packages folder can be ignored because of Package Restore
145 | **/packages/*
146 | # except build/, which is used as an MSBuild target.
147 | !**/packages/build/
148 | # Uncomment if necessary however generally it will be regenerated when needed
149 | #!**/packages/repositories.config
150 |
151 | # Microsoft Azure Build Output
152 | csx/
153 | *.build.csdef
154 |
155 | # Microsoft Azure Emulator
156 | ecf/
157 | rcf/
158 |
159 | # Microsoft Azure ApplicationInsights config file
160 | ApplicationInsights.config
161 |
162 | # Windows Store app package directory
163 | AppPackages/
164 | BundleArtifacts/
165 |
166 | # Visual Studio cache files
167 | # files ending in .cache can be ignored
168 | *.[Cc]ache
169 | # but keep track of directories ending in .cache
170 | !*.[Cc]ache/
171 |
172 | # Others
173 | ClientBin/
174 | ~$*
175 | *~
176 | *.dbmdl
177 | *.dbproj.schemaview
178 | *.pfx
179 | *.publishsettings
180 | orleans.codegen.cs
181 |
182 | /node_modules
183 |
184 | # RIA/Silverlight projects
185 | Generated_Code/
186 |
187 | # Backup & report files from converting an old project file
188 | # to a newer Visual Studio version. Backup files are not needed,
189 | # because we have git ;-)
190 | _UpgradeReport_Files/
191 | Backup*/
192 | UpgradeLog*.XML
193 | UpgradeLog*.htm
194 |
195 | # SQL Server files
196 | *.mdf
197 | *.ldf
198 |
199 | # Business Intelligence projects
200 | *.rdl.data
201 | *.bim.layout
202 | *.bim_*.settings
203 |
204 | # Microsoft Fakes
205 | FakesAssemblies/
206 |
207 | # GhostDoc plugin setting file
208 | *.GhostDoc.xml
209 |
210 | # Node.js Tools for Visual Studio
211 | .ntvs_analysis.dat
212 |
213 | # Visual Studio 6 build log
214 | *.plg
215 |
216 | # Visual Studio 6 workspace options file
217 | *.opt
218 |
219 | # Visual Studio LightSwitch build output
220 | **/*.HTMLClient/GeneratedArtifacts
221 | **/*.DesktopClient/GeneratedArtifacts
222 | **/*.DesktopClient/ModelManifest.xml
223 | **/*.Server/GeneratedArtifacts
224 | **/*.Server/ModelManifest.xml
225 | _Pvt_Extensions
226 |
227 | # Paket dependency manager
228 | .paket/paket.exe
229 |
230 | # FAKE - F# Make
231 | .fake/
232 |
--------------------------------------------------------------------------------