Angular bootstrap ui issue with online website - angularjs

i'm developing a website which has a fully Angular front-end.It works well in my local server.When i moved the site to an online one, it gives an bower related error.I was used angular bootstrap ui cdn.But for other Angular related files are loading through a bower.json file.So i'm confused why this error occurs.Hope someone help me to solve this.

Related

AngularJS Upgrade to Angular Hybrid with Grunt/Bower

I have an older project that we want to add some more functionality to. It's a fairly big project so rewriting it is out of the question. I've been reading and following the Angular ngUpgrade guide to make the transition to be able to write Angular 2+ code and run it with my AngularJS application.
However, there are some things that I'm missing and I'm quite confused on what I need to do.
My team created the initial project using Grunt and Bower, looks like through a Yeoman generator. I've been following along in the PhoneCat Upgrade Tutorial and I'm at the part where it says to "Install Angular into the project, along with the SystemJS module loader."
At this point I've looked into SystemJS a bit and what we have with our Bower/Grunt setup but am fairly confused.
So my question is, do I need to change my AngularJS application to use SystemJS before continuing with the Angular Upgrade, or can Grunt and SystemJS work together in some way?

How do I load Angular 4 into an AngularJS app using SystemJS?

I want to convert an AngularJS app to Angular 4. I'm reading the official Angular documentation for upgrading from AngularJS at https://angular.io/guide/upgrade. It states this:
To begin converting your AngularJS application to a hybrid, you need
to load the Angular framework. You can see how this can be done with
SystemJS by following the instructions in Setup, selectively copying
code from the QuickStart github repository.
The 'Setup' link however leads to a page which doesn't mention SystemJS. How do I use SystemJS to load/build the Angular 4 framework into the existing AngularJS app?
The link you specified points to the Angular quickstart project which uses systemjs. https://github.com/angular/quickstart
Although the project is marked as deprecated it is currently still valid in how you can setup Angular with systemjs.
You can then use the quickstart as the basis for porting your code across and will enable you to follow the additional instructions in that setup steps.
That quote I gave from the Angular documentation is very confusing. What you actually need to do when upgrading is to somehow set up the scaffolding for an Angular 4 app within your project, then use SystemJS as the module loader that will load the Angular 4 modules at runtime (since there is currently incomplete native browser support for the EcmaScript module system).
I figured out by reading further through the upgrade guide (specifically the 'PhoneCat Upgrade Tutorial - https://angular.io/guide/upgrade#phonecat-upgrade-tutorial) that what you're expected to do is set up the QuickStart project in an independent location, somehow move most of it into your existing AngularJS project to provide the scaffolding for an Angular 4 project, then wire up SystemJS as the module loader by selectively using some of the SystemJS configuration that is inside your 'built' QuickStart project.

Eclipse & angularjs validation error: Unexpected token for import and export

I started to learn angular.js and build the hello world app according to the official angular site.
I'm working with Spring Tool Suite 3.8.4 and installed the AngularJS Eclipse 1.2.0 plugin and the test project was working fine without any validation errors.
After finishing this tutorial I made a git clone from this demo application, did all the installation steps, imported it as a project into Eclipse and configured it as an angular project (nature).
After all validation was done Eclipse showed me about 2500 errors with the message Unexpected token. I opened some files and it seems that the import and export keyword isn't recognized properly.
As the hello world app uses also these keywords and didn't have any validation errors I assume the reason could be a configuration problem. If i compare them in my project explorer i was wondering why in my hello world app was only a folder "TypeScript Resources (2.2.2)" and in this imported project there is also one folder/lib called "Javascript Resources". Might be ok, just something i noticed.
As im totally new to angular I have no clue what I could check. I read that the angular js support for the Eclipse IDE isn't perfect but these articles have been partly outdated as they were using Angular 1.x and 2.x.
Running the application with npm start in a terminal or "Run as" ==> ng serve" works fine without any problem.
Both applications (hello world and the cloned one) use Angular 4.x.
Does anybody have an idea? Do I need to provide more information?
At first just to clarify things, you have installed Angular2 Eclipse which is for Angular2, Angular4 and where you develop with TypeScript. AngularJS Eclipse is for Angular1 where you develop with JavaScript.
You error is a JavaScript Problem which comes from the JSDT plugins. It seems that you have added JSDT nature. I suggest you to remove JSDT nature from your project because you develop with TypeScript and not with JavaScript.
To do that you can edit your .project file and remove this line:
<nature>org.eclipse.wst.jsdt.core.jsNature</nature>
If you need to open JavaScript file in an editor with validation, completion, etc, TypeScript IDE provide a JavaScript (Salsa) Editor which does that. You open your JS file with JavaScript (Salsa) Editor:
and after you benefit from the same feature than TypeScript editor:

Suddenly all my scripts fail to resolve

I am making a AngularJS app for a school project. I am using AngularJS, Material, Bower, Bootstrap and Yeoman. Everything was working fine but know my scripts fail to resolve, i resolved a few doing it manually but now i see all the scripts are failing to resolve, making me think there is another issue.
Anyone know what i did :O?

Angular Google Maps Uncaught ReferenceError: _ is not defined

I am using Maven + npm to use Angular Google Maps. It was working fine until I upgraded all my dependencies to latest version including Angular to 1.5.8
I even tried including underscore as a dependency, but it doesn't seem to be working either.
Inside main.js
var angularGoogleMaps = require('angular-google-maps');
In Package.json
"angular-google-maps":"^2.3.4"
Please suggest me something. I have tried everything I could find on Google, but unable to solve this issue
For anyone looking answer to the problem I faced, here are my findings:
Angular Google Maps 2.3.4 has some compatibility issue with latest lodash version (tested with 4.15.0). Reverting back to 3.8.0 didn't help so I had to switch to angular-google-maps 2.3.3 and it works fine with 4.13.1.
A ticket for the same has been opened at Github, link: _ coudn't be found

Resources