Answer the question
In order to leave comments, you need to log in
How to dynamically create a directive in an AngularJS controller?
Hello!
There is the following task:
In an AngularJS SPA, in a specific controller, you need to dynamically declare a directive received from the server using AJAX.
On the server, I have directives that describe input forms (more than 3000 forms).
More precisely, I declare the directive once, but I want to set its implementation dynamically based on the received data.
Tried the following:
// метод контроллера
$scope.add = function(ev,attrs){
//ajax вызов
.success(function (data, status, headers, config) {
// получили директиву с сервера
var exFormDirective = data.newForm;
// добавили ее к модулю
myApp.directive('exForm', exFormDirective );
// динамически создали элемент
var exFunction = angular.element(document.createElement('ex-Form'));
// скомпилировали
var el = $compile( exFunction )( $scope );
// Добавили созданный элемент на страницу
angular.element(document.getElementById('exTempleate')).append(exFunction);
// добавили ее к модулю
myApp.directive('exForm', exFormDirective );
Answer the question
In order to leave comments, you need to log in
Here is something about your problem
stackoverflow.com/questions/15279244/dynamically-a...
jsfiddle.net/ftfish/KyEr3
But the essence is the same, the directive must be included .. It is possible not to participate in the current html output, but to be described from the code received via Ajax, but the directive code itself (controllers, linkers, etc.) must be present.
Otherwise.. something like this weblogs.thinktecture.com/pawel/2014/07/angularjs-d...
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question