How do we define the angularjs directive in the requirejs module?

I'm not quite sure how to query and define a directive using the requirejs module.

this is my code for a file containing directives of the /locationBtn.js directive

define(['Zf2NVIApp'], function (Zf2NVIApp) { 'use strict'; Zf2NVIApp.directive('locationBtn', function() { return { template: '<div></div>', restrict: 'E', link: function postLink(scope, element, attrs) { console.log("we are in the location btn module"); element.text('this is the locationBtn directive'); } }; }); }); 

this is the code of my main.js file

 require.config({ shim: { }, paths: { angular: 'vendor/angular', jquery: 'vendor/jquery.min', locationBtn: 'directives/locationBtn' } }); require(['Zf2NVIApp', 'locationBtn'], function (app, locationBtn) { // use app here angular.bootstrap(document,['Zf2NVIApp']); }); 
+8
angularjs requirejs
source share
1 answer

You're close Given that your Zf2NVIApp.js file contains

 define(['angular'], function(angular){ return angular.module('Zf2NVIApp', []); }); 

you only need to return the value in your AMD module definition, and it should work:

 define(['Zf2NVIApp'], function (Zf2NVIApp) { 'use strict'; Zf2NVIApp.directive('locationBtn', function() { return { template: '<div></div>', restrict: 'E', link: function postLink(scope, element, attrs) { console.log("we are in the location btn module"); element.text('this is the locationBtn directive'); } }; }); // You need to return something from this factory function return Zf2NVIApp; }); 
+12
source share

All Articles