How to add angular js module inside an existing application

Question

I am trying to add an angular JS module inside an already existing code. I'm actually trying to add a new piece of code inside it. The workflow goes like this. When a button is clicked, the JS takes a template and adds it to the dom. In this added template, i would like to insert the new angular JS module. I am trying to atleast show hello world inside the module but haven't been successful.

Let's say when a button is clicked, i'm adding the below tag to the dom

<div patient-details ng-controller='patientDetailsCtrl' id='patientDetails'></div>

This is added through jquery or javascript. How do i make it work with the below directive

angular.module('patientDetailsModule',[])
.directive('patientDetails',function($compile){
    return{
        //restrict: 'E',
        template: "<div>Hello World!!!{{name}}</div>"
    };
});

I did not understand :(. Could you explain?

gustavodidomenico
– gustavodidomenico

2014-08-27 20:11:37 +00:00
Commented Aug 27, 2014 at 20:11 — gustavodidomenico
– gustavodidomenico, Commented Aug 27, 2014 at 20:11

user3180309 · Accepted Answer · 2014-08-27 20:15:02Z

1

You need to use $compile. $compile() will make sure all the Angular code in your html snippet will be compiled!

Here is an example.

http://plnkr.co/edit/7Wr3oAtvZ8cn31uFFEOs?p=preview

Send Message from nc-click to directive

Directive receives message, compiles html and appends new element

            var template = "<div patient-details ng-controller='patientDetailsCtrl' id='patientDetails'>Element added</div>";
            var newElement = angular.element(template);
            $compile(newElement)(scope);
            element.append(newElement);
            // can also use element.replaceWith(newElement);

answered Aug 27, 2014 at 20:15

user3180309

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to add angular js module inside an existing application

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related