Issue
I am trying to build a view with a button that can add select-elements (for now).
Therefore the "FilterController.js" can add elements to its (here called filters) array.
```(function () {
"use strict";
angular.module('app').controller('FilterController', FilterController);
function FilterController() {
let ctrl = this;
ctrl.filters = [];
ctrl.addFilter = function () {
ctrl.filters.push('filter' + ctrl.filters.length);
}
}
}
)```
In the blade.view every item in the controller list should be displayed with a loop.
<div class="filter row" ng-controller="FilterController as ctrl">
<div class="col-lg-4">
<div class="panel panel-default">
<div class="panel-heading">[['filter.filter' | translate]]</div>
<div class="panel-body">
<form ng-repeat="item in ctrl.filters" class="form-horizontal">
<div>
<select class="select_[[item]]" ></select>
</div>
</form>
<button type="button" class="btn btn-default" ng-click="ctrl.addFilter()">
<span class="glyphicon glyphicon-plus"></span>
<label for="button-label">[['filter.addFilter' | translate ]]</label>
</button>
</div>
</div>
</div>
This leads to a problem while build the app.js file. All the js is not not working in the browser.
Also there is this error in the browser console:
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
[$injector:modulerr] Failed to instantiate module directives.select2 due to:
[$injector:nomod] Module 'directives.select2' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.5.11/$injector/nomod?p0=directives.select2
minErr/<@http://{{mylocalinstance}}/build/js/app-32003bf5e4.js:13328:12
setupModuleLoader/</module/<@http://{{mylocalinstance}}/build/js/app-32003bf5e4.js:15393:17
ensure@http://{{mylocalinstance}}/build/js/app-32003bf5e4.js:15317:38
module@http://{{mylocalinstance}}/build/js/app-32003bf5e4.js:15391:14
createInjector/loadModules/<@http:{{mylocalinstance}}/build/js/app-32003bf5e4.js:17929:22
forEach@http://{{mylocalinstance}}/build/js/app-32003bf5e4.js:13585:20
loadModules@http://{{mylocalinstance}}…
The error points out the registration of the module, but I didn't find some answers that could help me. ( AngularJS, load module)
Thanks in advance. It also could be something very basic. I am quite new to angularJs. :)
EDIT: This error also shows up -
Uncaught TypeError: (intermediate value)(...) is not a function
<anonymous> HostController.js:68
HostController.js:68 HostController.js:68
Solution
We fixed it!
(function () {
"use strict";
angular.module('app').controller('FilterController', FilterController);
function FilterController() {
let ctrl = this;
ctrl.filters = [];
ctrl.addFilter = function () {
ctrl.filters.push('filter' + ctrl.filters.length);
}
}
})();
The ();
at the end was missing to self-invoke the function above (witch is also placed in parentheses).
https://developer.mozilla.org/en-US/docs/Glossary/IIFE
Answered By - LBR
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.