Angular eclipse - angularjs

Angular highlighing stopped working.(For example I get undefined attribute ng-app). Before I had an option under configure to convert the project to an angular project, but that option is now missing.
I tried reinstalling angular plugin, I even updated to luna but I lost any angular capabilities.

Great light angular.js in webstorm with angular plugin, the better ispolzuite it and I think You will like it.
Оtherwise with eclipse try Eclipse AngularJS Plugin Configuration
http://www.youtube.com/watch?v=k2ulCdYz-zM
or
http://blog.diniscruz.com/2014/02/using-angularjs-in-eclipse-part-3-wire.html

Eclipse seems to be falling behind when it comes to writing angular code. I had issues trying to get a legitimate plugin for es6 as well. If you're willing to try out a new editor, you might want to consider intelliJ IDEA which will also allow you to write easily in Java or Spring.
If you're just writing angular, with no server side needs, vs code is free, lightweight, and incredibly handy. Before acquiring a license for intelliJ, I just opened up the angular part of my application in vs code and edited it there. You can even download angular "snippets" to scaffold common structures like controllers or routes for you.

Related

Upgrading from AngularJS1.2 to Angular

I am currently working in AngularJS 1.2 application, it is a medium size application with 25 modules, now I want to upgrade to angular new version. I can't write freshly because it is an old project, I don't know older requirements of this project. Please any one suggest me the best way to achieve it.
Its not that easy to convert a angular-1 project to Angular-2+. You must need a fresh start, because both the framework is totally different. For project requirement/ business logic, you must understand the logic and the code and then write a fresh code in Angular-2+.
You may copy and paste any javascript code from angular-1 to angular-2+. It will work properly.
This page helped me a lot when I upgraded to angular: https://angular.io/guide/upgrade
A very good handbook for upgrading to angular is: https://angular.io/guide/ajs-quick-reference
A good solution would be to use ngUpgrade: run both AngularJS and Angular at the same time. All Angular code is running in the Angular framework, and AngularJS code in the AngularJS framework.
What happens on top of this is that components and services managed by one framework can interoperate with those from the other framework. This happens in three main areas: Dependency injection, the DOM, and change detection.
Some main things to take into consideration when upgrading:
- Get AngularJS and Angular components and services talking to each other during the upgrade
- Replacing controllers
- Replacing $scope and $watch
- convert directives to components

Why we need to use angular cli?

Hello everyone I want to learn angular, but I am bit confused like what is the use of angular cli??
Why I need to write 3 different files like app.html, app.component.ts and app.module.ts instead of writing code in those three files can't we use angular cdn directly? How better that component based architecture will work?
Please do not laugh at me I am new to this topic so previous are random questions that came to my mind while surfing the internet.
Angular CLI stands for Angular Command Line Interface (see this link). As the name implies, it is a command line tool for creating angular apps. It is recommended to use angular cli for creating angular apps as you don't need to spend time installing and configuring all the required dependencies and wiring everything together.
The Angular CLI is used for much more than just creating an Angular project. It can be used to create components, services, pipes, directives and more. Also it helps in building, serving, testing etc. CLI itself is quite something to learn about, it makes Angular development workflow much easier and faster.
I will try to provide little more thorough answer on this and give a few examples too.
First of all, Angular CLI is a command-line interface tool that you use to initialize, develop, scaffold, and maintain Angular applications directly from a command shell. It saves you from the hassle of complex configurations and build tools like TypeScript, Webpack, and so on.
After installing Angular CLI, you’ll need to run one command to generate a project and another to serve it using a local development server to play with your application.
Here are a few basic and useful commands that show the benefit of using it:
ng help
ng generate --help
ng new my-first-project
cd my-first-project
ng serve
For more commands info and their full explanation refer to the official documentation here: Angular CLI Official Page.
You do not have to use Angular CLI in order to create and run and develop Angular apps, but isn't it best to use "GG" electric socket covers with "GG" frames for those covers?
Angular cli can ease you work setting up maintain and customize your angular projects. Here are some of the main reasons you should use it:
https://scotch.io/tutorials/use-the-angular-cli-for-faster-angular-2-projects

Is there a way I can use angular-generator without yeoman?

Basically what I want is a scaffolding tool (without bower and other stuff that it comes with) and controller, service/factory generators.
Yeoman is great but I was wondering if there's anything minimalist cli out there for angular.
Well, if all you want is a base angular app structure, that is called a boilerplate. There are a few available:
https://github.com/angular/angular-seed
https://github.com/ngbp/ngbp
https://github.com/angular-app/angular-app
However, you seem to also want a controller, service/factory generator. This will always require:
some kind of task runner (like Grunt)
or an IDE that supports templates.
Since you don't seem to like grunt (grunt IS AWESOME), these IDEs might help you...
Eclipse supports template, you can find some here
IntelliJ's PHPStorm or WebStorm have a feature called Live Templates which, IMHO, are far better than eclipse. You can find some premade templates here, but is easy to roll your own, as explained in this tutorial.
If you want a command line interface but not Yeoman's, you might want to have a look at the "Generation" section of this collection. As of today, it has one option that uses Lineman and two that made their own CLI, but they use bower. Anyway, if what you're looking for exists, it should be in there somewhere.

AngularJS with Durandal?

Is it possible to run AngularJS in a Durandal project? We are using Durandal now but want to move to AngularJS while still keep the site operational. Is it even a good idea to attempt this?
Any suggestion would be greatly appreciated.
You could run them side-by-side, but then you would just have two separate SPAs hosted on the same site. The doesn't seem like a good upgrade strategy to me. I think you would be better off to fully develop the new version and then replace the site altogether.
I would also advise that you wait for the release of AngularJS 2.0 (if possible). Rob Eisenberg has announced that he is currently working with the AngularJS team to provide core changes and plugins that will make Angular 2.0 more familiar to developers with Durandal experience, as well as to provide a migration path from Durandal to Angular 2.0.
The other answer isn't exactly correct. I have an example that proves it wrong.
Durandal is a module loader that can load any view / view model pair. If you choose to load an angular application and leave out the router portion it works just fine. It really isn't that difficult to get it set up.
Wrap your Angular.js application initialization code in an AMD module (view model) with a matching view and it just works.

Testing AngularJS without having to build?

I'm a beginner to Angular, and am just starting some development.
I've taken the code from https://github.com/angular-app/angular-app, but am having to 'grunt build' every time to see my front end code changes on the browser. I've tried a variety of methods but am failing.
Is there a way to make changes, hit save, refresh your browser and see the changes, without having to build all the time?
Try grunt watch instead of grunt build. The gruntfile for that project seems to indicate that it will run the build task for you automatically by watching targeted files (e.g. .js, .less, etc.) for changes and then firing.
Note that you have to let it continue to run while you work, although you can run it as a background task and either hide the output or log it to a file.
Being a beginner, you might as well start from scratch.
This post
by Leon Revill contains pretty much step-by-step guides on the basics, structure, MVC, data-binding, events and filters. Regarding your build dilemma, just use your favorite IDE. I prefer you use WebStorm or PHPStorm and install the AngularJS plugin. This way, all you need to do is just include the Angular CDN or a local copy of angular.js then you are good to go just by coding and refreshing the browser.
Cheers!

Resources