facebook
  1. Genuitec Learning Center
    2.  > 
  2. Web Apps
    3.  > 
  3. Modern Web

AngularJS in MyEclipse

Support for AngularJS was introduced in MyEclipse 2015 CI 7. Read on to see what features are included. 

 

Download

1. AngularJS Support

Initial MyEclipse support for AngularJS is available in MyEclipse 2015 CI 7. Subsequent releases will offer even more AngularJS integration. Currently, support includes the following features:

    • Code-assist
    • Syntax checking
    • Validation
    • AngularJS Explorer view
    • Editor preferences
To enable project support for AngularJS, right-click the project, and select MyEclipse>JavaScript Modules>Install AngularJS support.

js_resource_menu Enabling AngularJS from the menu

As an alternative, you can open the project’s properties page, expand MyEclipse and select JavaScript Resources. Select the angular option on the Technologies tab.


Enabling AngularJS from project properties

After selecting the AngularJS technology for a project, simply add the appropriate AngularJS libraries to your project and you are all set.

2. Code Assist

The default directives syntax prepends “ng-” to directive names. In the HTML editor, content assist provides directive names.

directive_content_assist Directive assist

You can change your preference for directive name syntax. The code completion will reflect your preference settings.

directive_syntax_prefs
Directives syntax preferences

Module content assist is also available in the HTML editor.

module_content_assist Module content assist

In the JavaScript editor, code completion is available for the angular module.

js_content_assist JavaScript editor content assist

3. Validation

Validation for AngularJS is available for Angular syntax. The validator is an extension of the HTML syntax validator. Therefore, to avoid HTML warnings on AngularJS syntax, enable the HTML Angular Syntax Validator and disable the HTML Syntax Validator.

validator
AngularJS syntax validator

The same goes for the JSP Content Validator. To avoid Angular syntax warnings when using JSP, disable the JSP Content Validator when you enable the JSP Angular Content Validator.

4. Angular Explorer View

View and navigate AngularJS elements using the Angular Explorer view. Open the view by selecting Window>Show View>Other, expanding AngularJS, and choosing Angular Explorer.

|angular_explorer
Angular Explorer view

5. General Preferences

When no project is selected, you can set syntax coloring preferences specific to AngularJS, as well as specify if you want to automatically close AngularJS expressions when editing.

general_prefs

General AngularJS preferences