This is the situation: I've controller2 nested inside controller1. I want to pass or bind some data from the view into controller 2 and show this data in a modal. The modal opens but doesn't show the data passed from the view. The console however shows the data is passed into the controller.
As you can see I'm using Angularjs with bootstrap 4 and jQuery. I did several modals in only 1 controller at a time, but now I want to use this nested controller. How do I get the data into this particular modal?
VIEW:
<div ng-controller="controller1 as ctrl1">
....some code...
<div ng-controller="controller2 as ctrl2">
<h5 data-toggle="modal" data-target="#myModal" data-myparam="wood">
open modal</h5>
</div>
... some more code ...
</div>
<!-- MODAL -->
<div ng-controller="controller2 as ctrl2">
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<h5>My parameter: {{ctrl2.param}}</h5>
</div>
</div>
</div
</div>
MODEL for controller2:
....
$('#myModal').on('show.bs.modal', function(e){
vm.param = e.relatedTarget.dataset.myparam;
console.log(vm.param);
});