Is it possible to create two directives with the same module name? Having this two files
angular.module('fabTemplate', [])
.directive('fabGallery', [function () {
....
and
angular.module('fabTemplate', [])
.directive('fabVideo', [function () {
...
The second directive will not be recognised.
<fab-video />
does not render anything. By changing the module name works though.
AngularJS's documentation says that the parameter name (first param of module "method")
The name of the module to create or retrieve.
I suppose that should work then... :S Angular doesn't print anything into the console
... is quite illustrative as AngularJS doesn't allow multiple directives (on the same DOM level) to create their own isolate scopes. According to the documentation, this restriction is imposed in order to prevent collision or unsupported configuration of the $scope objects.
Yes, you can define multiple modules in angularJS as given below. The modularization in AngularJS helps us to keep the code clarity and easy to understand, as we can combine multiple modules to generate the application.
templateUrl can also be a function which returns the URL of an HTML template to be loaded and used for the directive. AngularJS will call the templateUrl function with two parameters: the element that the directive was called on, and an attr object associated with that element.
Compiles an HTML string or DOM into a template and produces a template function, which can then be used to link scope and the template together.
AngularJS has a set of built-in directives which offers functionality to your applications. AngularJS also lets you define your own directives. AngularJS directives are extended HTML attributes with the prefix ng-. The ng-app directive initializes an AngularJS application. The ng-init directive initializes application data.
AngularJS Directives. AngularJS directives are extended HTML attributes with the prefix ng-. The ng-app directive initializes an AngularJS application. The ng-init directive initializes application data. The ng-model directive binds the value of HTML controls (input, select, textarea) to application data. Read about all AngularJS...
One can also create a custom directive which can be used to inject code in the main angular application. Custom directives can be made to call members defined in the scope object in a certain controller by using the ‘Controller’, ‘controllerAs’ and ‘template’ keywords.
For AngularJS, "compilation" means attaching directives to the HTML to make it interactive. The reason we use the term "compile" is that the recursive process of attaching directives mirrors the process of compiling source code in compiled programming languages. Matching Directives
If you want to retrieve a module, then you must use only the first param of angular.module().
From the docs:
requires (optional) [Array.] : If specified then new module is being created. If unspecified then the the module is being retrieved for further configuration.
Your code should be something like:
//Module definition:
angular.module('fabTemplate', []);
//Get the module and add the first directive:
angular.module('fabTemplate').directive('fabGallery', function () {});
//Get the module and add the second directive:
angular.module('fabTemplate').directive('fabVideo', function () {});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With