Angularjs Scope in Jquery Modal popup

Question

js 1.3 with jquery. I have to display a form input in modal window. For which I have written a jquery function which will open the hidden dom content in Modal window.

ShowModal.open({
    content: $(".modal_content").html(), //Get html content form dom
})

Code for modal is working fine. The problem is the modal is not getting the controller's scope. I am using "Controller As" syntax for controller:

function controller(){
    bindVm = this;
    bindVm.data = ["Hello", "World"]
}

In Modal window

<div ng-controller="controller as bindVm">
    <div class="modal_content"> {{bindVm.data[0]}}</div>
</div>

The controller's code is working fine for normal page, but not working in modal window.

Note : I am also attaching html content using $compile

$modalContent.html($compile($modal_content)($scope));

Still not working. Anybody got something.

Community · Accepted Answer · 2017-05-23 12:24:47Z

1

In modal you need to resolve your variables or scopes and pass to modal controller then you can start to use them check here Angular-UI Modal resolve

Pass parameter to modal

edited May 23, 2017 at 12:24

CommunityBot

11 silver badge

answered Feb 16, 2016 at 14:49

user5887606

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

1 Comment

Rahul Sagore Over a year ago

I am not using Angular-UI. I created my own custom modal function with jquery. Read the question carefully.

Rahul Sagore · Accepted Answer · 2016-02-17 09:37:46Z

0

The problem has been solved. used $templateCache to get the template and attaching data to $scope instead of bindVm alias.

html:

<script type="text/ng-template" id="template1.html">
    <div class="modal_content"> {{data[0]}}</div>
</script>

JS:

$modalContent.html($compile($templateCache.get('template1.html'))($scope));

Working now.

answered Feb 17, 2016 at 9:37

Rahul Sagore

1,6682 gold badges29 silver badges49 bronze badges

Collectives™ on Stack Overflow

Angularjs Scope in Jquery Modal popup

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related