How to point Angular static assets to WWW URL

Issue When I run ng build I get this index.html file: <!doctype html> <html lang=”en”> <head> <meta charset=”utf-8″> <title>ApiApp</title> <base href=”/”> <meta name=”viewport” content=”width=device-width, initial-scale=1″> <link rel=”icon” type=”image/x-icon” href=”favicon.ico”> </head> <body> <script type=”text/javascript”> const appData = JSON.parse(‘<%=json%>’); </script> <app-root></app-root> <script

Continue reading

Is this possible to change script path in index.html file after build completed?

Issue I have one angular-cli application, when i give ng build command it creates build file which has index.html file. In index.html file, scripts paths are referred like below: <script type=”text/javascript” **src=”runtime.js”**></script> <script type=”text/javascript” **src=”polyfills.js”**></script> <script type=”text/javascript” **src=”styles.js”**></script> <script type=”text/javascript”

Continue reading

Angular/cli issue

Issue I have a strange problem with angular/cli (WINDOWS). A year ago, I installed angular on my computer and I created a new project, all fine. I’ve been updating angular when a new version came out (now I’m on v7).

Continue reading

Angular build for production fails

Issue When I try to build for production my angular application with the following command ng build –prod –build-optimizer I get the following output: Date: 2019-01-29T08:39:12.193Z Hash: 05648c76cf91b1245f68 Time: 27920ms chunk {0} runtime.1eee2a92f0ed121267d0.js (runtime) 2.22 kB [entry] [rendered] chunk {1}

Continue reading

has no exported member 'ComponentsHelper

Issue I got an error when I run ‘npm start’: ERROR in [at-loader] src/app/app.component.ts:7:10 Module ‘”/Users/xx/Documents/sourcecode/xx/xx/xx/node_modules/ng2-bootstrap/index”‘ has no exported member ‘ComponentsHelper’. line 7 in app.component.ts is import { ComponentsHelper } from ‘ng2-bootstrap’; In my package.json, my version is “ng2-bootstrap”: “^1.2.4”.

Continue reading

ngUpgrade with Angular-cli

Issue I have a hybrid AngularJS (1.7.0) and Angular 6 app. I am also using @angular/upgrade module to upgrade/downgrade components and services. I have got it working using custom webpack but now I want move towards angular-cli. Can anyone suggest

Continue reading

router link attribute within the button tag doesnt work

Issue I am unable to navigate with router link attribute that is placed within the button tag. Here is my code, <button mat-raised-button color=”primary”><a routerLink=”/message-inbox”>Inbox</a></button> <button mat-raised-button color=”accent”><a routerLink=”/sent”>Sent</a></button> <a routerLink=”/message-compose”><button color=”warn”>Compose</button></a> Solution I dint import the the router module.

Continue reading

Display suitable validation error message

Issue HTML <form class="row" [formGroup] = "loginForm" (ngSubmit)="UpdateProfile()"> <input type="text" formControlName="first_name" /> <span *ngIf="this.loginForm.controls.first_name != null && this.loginForm.controls.first_name.errors != null"> Please enter first name </span> <button type="submit" [disabled]="loginForm.invalid" class="btn btn-primary"> Update Profile </button> </form> Js Side this.loginForm = new FormGroup({

Continue reading

Angular 5 – include jquery plugin

Issue Im new to angular, currently working with version 5. I have to install a plugin called ‘jquery-circle-progress’, which can be found here: http://kottenator.github.io/jquery-circle-progress/ I’ve installed it with via npm, and added the .js file to .angular-cli.json scripts array. It

Continue reading

'Uncaught Error: Can't resolve all parameters for' runtime error when upgrading from Angular 4 to 5.0.1

Issue This is fine in Angular 4.x, just not Angular 5.0.1. This project was generated with Angular CLI. compiler.js:466 Uncaught Error: Can’t resolve all parameters for RegistrationService: (?). at syntaxError (compiler.js:466) at CompileMetadataResolver._getDependenciesMetadata (compiler.js:15546) at CompileMetadataResolver._getTypeMetadata (compiler.js:15381) at CompileMetadataResolver._getInjectableMetadata (compiler.js:15361)

Continue reading

Upgrading to Angular 5, splitHash error

Issue I am currently in the process of upgrading from Angular 4.x to 5.x and have been running into the following error: main.81bcdf404dc22078865d.bundle.js:1 Uncaught TypeError: i.splitHash is not a function at Object.t.parseUrl (main.81bcdf404dc22078865d.bundle.js:1) at t.path (main.81bcdf404dc22078865d.bundle.js:1) at e.<anonymous> (main.81bcdf404dc22078865d.bundle.js:1) at

Continue reading

Angular 5 Load CDN script tag from Angular-cli.json

Issue I am using Angular 5 for the project. My index.html looks like this :- <html lang=”en”> <head> <meta charset=”utf-8″> <title>PDL Web</title> <link href=”/assets/Images/favicon.ico” rel=”shortcut icon” type=”image/x-icon”> <base id=”baseHref” href=”/”> <meta name=”viewport” content=”width=device-width, initial-scale=1″> </head> <body> <app-root></app-root> </body> </html> <script

Continue reading

How to include JQuery plugins in Angular 2?

Issue i installed jquery plugin in angular 2 project Link npm i jquery-bootstrap-scrolling-tabs and add in .angular-cli.json “styles”: [ “styles.css”, “../node_modules/jquery-bootstrap-scrolling-tabs/dist/jquery.scrolling-tabs.css” ], “scripts”: [ “../node_modules/jquery/dist/jquery.js”, “../node_modules/jquery-bootstrap-scrolling-tabs/dist/jquery.scrolling-tabs.js” ], and i declare the veritable typings.d.ts declare var scrollingTabs:any; using in app.component.ts ngAfterViewInit()

Continue reading

Angular Module vs. Library

Issue So great, the Angular has released version 6 and the CLI provides an option to generate libraries – something that they call a “highly anticipated feature”. Now, coming from a business perspective, I am wondering: why you would actually

Continue reading

Angular call function inside forRoot method

Issue The problem is that I’m calling a function inside forRoot method like this: app.module.ts import {environment} from ‘../environments/environment’; … @NgModule({ imports: [ BrowserModule, MyModule.forRoot({ config: { sentryURL: environment.SENTRY_URL <– This, calls the function } }), HttpClientModule, … ]}) environemnt.ts

Continue reading

scss compilation issue in angular lib created using angular-cli

Issue Created(ng build my-lib) an angular lib with global scss then bundled into one file and copied to lib’s folder. dist-lib/my-lib/lib/sass/my-lib.scss Now my-lib.scss imports some resources like @font-face { font-family:”Roboto Regular”; font-weight:normal; font-style:normal; src: url(“../resources/fonts/roboto-regular/Roboto-Regular.eot?”) format(“eot”), /* IE9 Compat Modes

Continue reading

Issue while installing Angular Cli

Issue C:\Users\Tauseef\Desktop>npm install -g @angular/cli@latest npm ERR! Unexpected end of JSON input while parsing near ‘…lr8Pw+hghLU8LySls45dS’ npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Tauseef\AppData\Roaming\npm-cache\_logs\2019-08-10T18_54_50_700Z-debug.log That are happening while i am installing an Angular

Continue reading