AngularJS: Get template attribute value in controller

Question

I am a newbie of angularjs using version 1.6.4. I am using this module leon/angular-upload for upload functionality, minify version. On successful upload request, server return json object of uploaded file information on onSuccess(response) function as you can see in my user-registration.template.html file. Now i need to take this json object to my controller so that i can save this information in my database. Below is the few lines of my code.

user-registration.template.html:

<form role="form">
                <div class="form-group float-label-control">
                    <label>Name</label>
                    <input type="text" placeholder="Name" class="form-control" ng-model="model.user.name">
                </div>
                <!--  leon/angular-upload -->
                <div upload-button
                     url="/user_uploads"
                     on-success="onSuccess(response)"
                     on-error="onError(response)">Upload</div>

                <div class="text-center">
                    <button type="button" class="btn btn-default" ng-click="model.save(model.user)">Save</button>
                </div>
            </form>

My component "user-registration.component.js":

(function(){
    "use strict";

    var module = angular.module(__appName);
function saveUser(user, $http){
        var url = user.id > 0 ? __apiRoot + "/users/" + user.id : __apiRoot + "/users";
        var dataObj = {
            payload: JSON.stringify(user),
            _method: "PUT"
        }
        return $http.post(url, dataObj);
    }

    function controller($http){
        var model = this;
        model.user = null;


        model.save = function(user){
            console.log(JSON.stringify(user));
            saveUser(user, $http).then(function(response){
                alert(response.data.msg);
            });
        }
    }

    module.component("userRegistration", {
        templateUrl: "components/user-registration/user-registration.template.html",
        bindings: {
            value: "<"
        },
        controllerAs: "model",
        controller: ["$http", controller]
    });

}());

Bilel Kabtni Bilel Kabtni · Accepted Answer · 2017-05-12T08:49:04

Try to put your server response data to rootScope model for Exempel :

$rootScope.serveResponse = response ;

and with this rootScope you can share your variable data between controller

AngularJS: Get template attribute value in controller

1 Answers