Alexander Alexander - 2 months ago 13
AngularJS Question

Can I send value from javascript to angular controller at runtime

For example, I have HTML that will show only in the popup

<div id="popup1" style="display: none; width: 600px; height: 400px; overflow: hidden">
<div ng-controller="DataBindingCtrl">



<div rel="title">
Show or Update Image
</div>
<div rel="body" style="padding: 10px; line-height: 150%">
<div >
<img src="https://upload.wikimedia.org/wikipedia/commons/a/ac/No_image_available.svg" style="float: left; background-color: white; width: 250px; height: 320px; border: 1px solid silver; margin: 5px;"/>
</div>
<div class="w2ui-field w2ui-span3">
<label>Files:</label>
<div>
<form class ="form-horizontal">
<input id="file" style="width: 100px" />{{selBookId}}
<input id="currentRecord" type="text" ng-model="currentRecordText" ng-model-instant>
{{currentRecordText}} {{idRec}}
</form>
</div>
</div>
</div>

@*<div rel="buttons">
<button class="btn" onclick="$('#popup2').w2popup()">Switch to Popup 2</button>
</div>*@
</div>




I want to set a value for idRec when the user clicks on the popup window button.

Is this possible and what is the proper way ?

Answer

I assumed that you want to change the scope variable from jQuery function.

You can use jQuery function in your Angular controller as below.

app.controller('AppCtrl', function($scope) {
    $('.popupCall').on('click', function(){
        $scope.idRec= "newValue";
        $scope.$apply();
        $('#popup2').w2popup();
    });
}

<button class="btn popupCall">Switch to Popup 2</button>