Using AngularJS

The ng object in entcore allows you to create controllers and directives. In your controllers or directives folder, add a new file:

/src/main/resources/public/ts/controllers/myNewController.ts

In the controller or directive file, export a new controller :

import { ng } from ‘entcore’;

export const myNewController = ng.controller(‘MyNewController’, [‘$scope’, ($scope) => {
});

You can then add it to a index.ts file in your folder :

export * from ‘./myNewController.ts’;

Finally, you need to add it to the ng controllers list. You can add all controllers at once by using the index file:

import * as controllers from ‘./controllers’;

for(let controller of controllers){
    ng.controllers.push(controllers[controller== ]);
}

Specific configuration

AngularJS default delimiters are \{\{\}\} :

<div>\{\{ myVar \}\}</div>

In ODE Framework, we use [[]] instead for compatibility issues:

<div>[[ myVar ]]</div>

The bootstrap is done on document by ODE Framework, after loading mandatory dependencies: translations, the user’s session, the application rights, etc… This is to make sure private or erroneous data aren’t displayed.

The ng module inside the entcore package is a wrapper making AngularJS functionalities available. It will hold directives, controllers, services, etc… until the module is created and make them available for bootstrap.

Remember, you can’t add directives or controllers after bootstrap. If you need dynamic compilation, try using templates or the $compile function inside a custom directive.

results matching ""

    No results matching ""