Tested in angular version 7:
- install jquery:
npm install jquery
install jquery typescript intellisense:
npm install @types/jquery
- edit the angular.json file in root folder:
in the architect / build / scripts location, add this:
"scripts": [ "./node_modules/jquery/dist/jquery.min.js" ]
- To use jquery inside a component.ts add this import at the top:
Example code to check for functionality:
<button (click)="testJQuery()">Test jquery</button>
Click on the button should fade out and fade in the entire page.
Source: How to include and use jQuery in Angular CLI project
NPM Package for converting from JSON to TypeScript object.
Source: json2typescript – npm
I wanted to try out some Angular code against a demo odata service, but when requesting data from another domain in a web browser (the angular context) you might get:
Access to XMLHttpRequest at ‘http://services.odata.org/V4/OData/OData.svc/Products?$format=json’ from origin ‘http://localhost:4200’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: Redirect is not allowed for a preflight request.
To get around this problem you could use a node proxy like this one:
Source: cors-proxy-server – npm
Install and start it up. Now we can call the odata service by prepending the proxy url before the actual api endpoint like this:
Notice the double http://
The entire CORS problem can be summarized like this:
More info regarding CORS here: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
Source: npm vs Yarn – Which Package Manager Should You Use? – KeyCDN
Test your front-end against a real API
A hosted REST-API ready to respond to your AJAX requests
Source: Reqres – A hosted REST-API ready to respond to your AJAX requests
When you reference a .js framework or library from your ASP.NET application, it makes sense to use the development version when you’re working on your own machine.
Referencing the development versions brings more useful error messages and integration with the React Developer tools.
But, you wouldn’t want to use these in production for performance reasons.
When you run the site in production, you’d want to reference the minified production versions of the React scripts.
Source: Different js scripts for different ASP.NET core environments· jonhilton.net – Making sense of .NET