CODEWITHSUNDEEP
javascriptangularjslocal-storage
user122222
user122222

Reputation: 2419

Local storage get value angular and pass to input

Here in this function, I pass values name, surname, email to local storage. I want to use these values for my input form so that user would not have to enter these values after using for once. How do I take each of value to print in my view HTML?

function submit() {  
    if($rootScope.name!=null)    {
        var JSONObject = {
             "name":$rootScope.name,
             "surname":$rootScope.surname,
             "email":$rootScope.email,
             "review":$rootScope.review
            }
        var temp={
            "name":$rootScope.name,
             "surname":$rootScope.surname,
             "email":$rootScope.email
        }
        $scope.localArray.push(temp);
        localStorageService.set("wimmtkey", $scope.localArray);
        var obtained_array = localStorageService.get("wimmtkey"); 

        var Results = UniversalService.PostReview(JSON.stringify(JSONObject));
        }
    }

This is my view.html

<form name="form" ng-submit="vm.submit()" role="form">
        <div >
            <div>
                <div class="form-group">
                    <label for="name">Name</label>
                    <input type="text" name="text" id="name" class="form-control" ng-model="vm.name" placeholder="Enter name here" required />
                    <span ng-show="form.name.$dirty && form.name.$error.required" class="help-block">Name is required</span>
                </div>
            </div>

            <div>
                <div class="form-group">
                    <label for="surname">Surname</label>
                    <input type="text" name="text" id="surname" class="form-control" ng-model="vm.surname" placeholder="Enter surname here" required />
                    <span ng-show="form.surname.$dirty && form.surname.$error.required" class="help-block">Surname is required</span>
                </div>
            </div>

             <div>
                <div class="form-group">
                    <label for="email">Email</label>
                    <input type="text" name="email" id="email" class="form-control" ng-model="vm.email" placeholder="Enter email here" required />
                    <span ng-show="form.email.$dirty && form.email.$error.required" class="help-block">Email is required</span>
                </div>
            </div>

            <div>
                <div class="form-group">
                    <label for="review">Review</label>
                    <input type="text" name="text" id="review" class="form-control" ng-model="vm.review" placeholder="Enter review here" required />
                    <span ng-show="form.review.$dirty && form.review.$error.required" class="help-block">Review is required</span>
                </div>
            </div>

           <div class="form-actions">
                <button id="submit" type="submit" onclick="passInfo()" class="btn btn-primary">Submit</button>
                <label style="display:none" id="label"><font color="white">Succesfully added!  

                <a onclick="refresh()" href="../ang/#!/review">Add new review</a></label> or 
                <a href="../ang/#!/">View reviews</a>
            </div>
        </div>

    </form>

Upvotes: 0

Views: 2454

Answers (2)

Komal K.
Komal K.

Reputation: 480

function submit() {  
    if($rootScope.name!=null)    {

        var temp={
            "name":$rootScope.name,
            "surname":$rootScope.surname,
            "email":$rootScope.email
        }
        localStorage.setItem('user_data',JSON.stringify(temp)); 
        // Stores temp to localStorage          
         var data = localStorage.getItem('user_data');
         // reads data from localStorage
                        vat $scope.tempData = JSON.parse(data);
                        console.log($scope.tempData);
                        // prints data retrived from localStorage and pass this tempData in html to use in html                         

        }
    }

Upvotes: 0

Rohan Kawade
Rohan Kawade

Reputation: 473

Write a init function to get the local storage data and set it in a $scope variable

HTML

<div ng-init="initialise()">

<input type="text" name="text" id="review" class="form-control" ng-
 model="obtained_array.review" placeholder="Enter review here" required />
//Rest of the HTML code goes here
</div>

In controller

$scope.initialise = function(){

 $scope.obtained_array = localStorageService.get("wimmtkey"); 

}

Upvotes: 1

Related Questions