AngularTS

AngularTS is an app-design framework and development platform for creating efficient and sophisticated single-page apps. You can build features quickly with simple, declarative templates. Extend the template language with your own components and use a wide array of existing components. Angular delivers the productivity and scalable infrastructure that supports Google's largest applications.

[Note]Note

AngularTS plugin is only available in CodeLobster IDE Professional.

CodeLobster integrates with AngularTS so you can use it from inside the IDE. AngularTS support includes the following features:

Creating Angular Project

Angular plug-in gives the ability to download the latest framework version from the original site and install it to the necessary folder using the wizard.

To create Angular project:

  1. Choose File | New | Project... main menu item. Select AngularTS framework item in the opened dialog.

    or

    Select Project | AngularTS | Create project main menu item

  2. Define project location, name and project URL for debugging.

    [Note]Note

    If you enable Create project in a new folder option CodeLobster IDE creates a subfolder with the project name.

  3. Click the OK button.

  4. Define the path to the directory with Node.js using the Browse button.

  5. Select installation type:

    • Install for project only

      or

    • Install CLI global. Required root/Administrator rights

  6. Click the Finish button to create Angular project.

AngularTS IntelliSense

CodeLobster IDE provides IntelliSense for AngularTS, which helps you write code more quickly and efficiently. The IntelliSense saves you time by putting what you’re most likely to use at the top of your completion list. The IntelliSense suggestion box includes AngularTS functions.

The suggestion list of the automatic completion appears as soon as you start typing. Pressing Tab or Enter will insert the selected item. You can trigger IntelliSense in the Editor window by pressing Ctrl + Space or using Edit | IntelliSense | Autocomplete main menu item.

Tooltips for AngularTS

Hover mouse for tooltips that includes descriptions for AngularTS methods. Tooltips appear automatically when you hover the pointer over a method or some other element.

AngularTS context and dynamic help

You can quickly obtain necessary information about AngularTJ syntax. The Dynamic Help window displays links to help topics for an element the pointer is placed on. AngularTS plug-in conducts a search to https://angular.io/

To get help topics using Dynamic Help:

  • Place the pointer on the target element and press the F1 button.

  • Select Help | Context Help main menu item.

  • Click the topic item in the Dynamic Help window.

    [Tip]Tip

    To show Dynamic Help select View | Panels | Dynamic Help main menu item.