2015-05-28 2 views
2

У меня есть элемент directive, который мне нужно вызвать из controller, вместо того, чтобы писать это в html-файле.Вызов директивы элемента управления от контроллера

Элемент Директива:

angular.module("providerApp") 
     .directive("openTab", function() { 
     return { 
      restrict: 'E', 
      templateUrl: '/resources/js/directiveView/openTab.html' 
     } 
    }); 

Это directive я хочу, чтобы вызвать через мой контроллер в script, а не писать в HTML-файл. Что-то вроде этого:

Контроллер

angular.module("providerApp") 
    .controller('appointmentsController', function() { 
     $("<div>").append("<open-Tab></open-Tab>"); 
}); 

Вместо того, чтобы писать в html файл, как написано below.I хотите пропустить директиву письма в разметке, как он должен быть оказаны динамически и его место в РОМ не фиксированный, который определяется controller.

разметке

<html> 
     <head></head> 
     <body> 
      <open-tab></open-tab> 
     </body> 
    </html> 

ответ

1

Ваш код будет работать, только вам нужно использовать $compile сервис для компиляции DOM, прежде чем добавить его в DOM, но это считается плохим рисунком в AngularJS.

Ведение DOM манипуляции с контроллера считается плохой практикой в ​​ угловых

Лучше создать свою собственную директиву, которая будет находиться на уровне тела. Контроллер, который хочет добавить элемент, будет $emit и событие вверх с selector & html. Чтобы директива добавила этот элемент внутри DOM.

Контроллер

app.controller('appointmentsController', function($scope) { 
    $scope.$emit('ElementAppend', { 
    selector: '#test', 
    html: '<open-Tab></open-Tab>' 
    }); 
}); 

Директива

app.directive('body', function($compile) { 
    return { 
    restrict: 'AE', 
    compile: function(element, attributes) { 
     return { 
     pre: function(scope, element, attributes) { 
      scope.$on('ElementAppend', function(e, data) { 
      $(element).find(data.selector).append($compile(data.html)(scope)); 
      }); 
     } 
     } 
    }, 
    } 
}); 

Demo

+0

Как я спросил, я не хочу, чтобы вызвать мою директиву разметке. В основном положение директивы в markUp определяется контроллером, поэтому оно должно динамически отображаться с контроллера. –

+0

@GyaneshGouraw thats мой плохой .. посмотрите на обновленное решение –

+0

@GyaneshGouraw вы проверили его.? –

Смежные вопросы