1

I tried to use UpgradeModule to bootstrap my app so I can use anglarJS components from Angular. But I keep on getting the following error in console. Please advise. I am using angular-cli to package my app. Do I need to add angular in package.json? Cause even if I did, I still got the error.

Unhandled Promise rejection: AngularJS v1.x is not loaded! ; Zone: ; Task: Promise.then ; Value: ZoneAwareError {__zone_symbol__error: Error: AngularJS v1.x is not loaded! at Object.noNg (http://localhost:4200/vendor.bundle.js

iPhoneJavaDev
  • 821
  • 5
  • 33
  • 78

1 Answers1

2

I run into the same problem today and solved by loading AngularJS as a Global script.

As described in the angular-cli's wiki:

You can add Javascript files to the global scope via the apps[0].scripts property in .angular-cli.json. These will be loaded exactly as if you had added them in a tag inside index.html.

This is especially useful for legacy libraries or analytic snippets.

"scripts": [
  "global-script.js",
],

So, basically you just have to add "../node_modules/angular/angular.js" to the app > scripts in the .angular-cli.json file.

After doing this, the app builds and works. One small caveat though, is that it now shows WARNING: Tried to load angular more than once. in the console, which can be multiple possible things, but not an error anymore.

I'll update the answer if/when I find out.

Community
  • 1
  • 1
mattarau
  • 2,484
  • 1
  • 16
  • 20
  • The warning of loading angular twice might be related to the point where it mentions not using `import * as angular from 'angular'` but rather just declaring it as an available variable so TypeScript can compile, i.e. using `declare var angular: any`, see the section [Using global libraries inside your app](https://github.com/angular/angular-cli/wiki/stories-global-scripts#using-global-libraries-inside-your-app) – jamiebarrow Jun 25 '18 at 13:58