Using AngularJS, I want to access scope variable from inside a <script type="text/ng-template"
.
<script type="text/ng-template" id="firstDialogId">
<div class="ngdialog-message" align="center" id="download">
<h4 ng-show=isFrench>Télécharger la cartographie</h4>
<h4 ng-show=isEnglish>Download cartography</h4>
<a href="../downloads/PDF/{{currentLanguage}}/{{currentCartography}}.pdf" download>
<img src="../style/images/pdf-icon.png" alt="Download PDF" width="30%" height="30%">
</a>
<a href="../downloads/VSD/{{currentCartography}}.vsd" download>
<img border="0" src="../style/images/vsd-icon.png" alt="Download VSD" width="30%" height="30%">
</a>
<a href="../downloads/PNG/{{currentLanguage}}/{{currentCartography}}.png" download>
<img border="0" src="../style/images/PNG-icon.png" alt="Download PNG" width="30%" height="30%">
</a>
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-primary" ng-click="closeThisDialog('button')">Close</button>
</div>
</div>
</script>
isFrench
and isEnglish
are 2 booleans from my controller.
Same for currentCartography
and currentLanguage
, they are strings from my controller.
I also tried with getter inside and outside of the controller, same result.
For those falling into the same issue :
Using ngDialog, we need to precise we want to use the scope.
In my case, I added the dialog open functions in my controller, I needed to edit the one I'm using in order to add the scope: $scope,
line as follows :
$scope.openPlainCustomWidth = function () {
$rootScope.theme = 'ngdialog-theme-plain custom-width';
ngDialog.open({
template: 'firstDialogId',
controller: 'InsideCtrl',
className: 'ngdialog-theme-plain custom-width',
scope: $scope, // this line wasn't here before
closeByDocument: false
});
};