How to set scope variable empty in angularjs

Question

This is my code.

$scope.sendFeedback = function ()  {

    var mobile1 = $scope.mobile;
    var feedback1 = $scope.feedback;

    var userfeedback = {
        mobile: mobile1,
        feedback: feedback1
    };

    var feedbackRef = firebase.database().ref("feedback/");
    var newFeedbackRef = feedbackRef.push();
    newFeedbackRef.set(userfeedback, function(error) {
        if (error) {
            alert ('Error while registering feedback.');
        } else {
            $scope.feedback = '';
            alert ('Your feedback is registered.');

        }
    });
}

After calling this function i can see alert ('Your feedback is registered.'); but $scope.feedback = '' not setting that particulat textField as empty. I tried $scope.feedback = null; also, but no luck.

what is wrong here?

Edit: HTML View added.

<md-input-container class="md-block">
    <label>Feedback</label>
    <input required="" name="feedback" ng-model="feedback" >
    <div ng-messages="projectForm.feedback.$error" role="alert">
     <div ng-message-exp="['required']">
        This field is required.
    </div>          </div>

</md-input-container>

Possible duplicate of AngularJS: When to pass $scope variable to function — Spencer Wieczorek
– Spencer Wieczorek, Commented Sep 15, 2016 at 23:59

Flint · Accepted Answer · 2016-09-16 00:20:43Z

I encountered that kind of problem several times, and solved it using the following workaround :

    angular.element(document.getElementById('doc'))
     .scope().$apply( function() {
            $scope.feedback=''
     )}

I made that very minimal working example, for the sake of testing the SO's snippet runner, and mostly using your own code. Hope this helps.

<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>

<script>
  var module=angular.module('test',[]).controller('test', function($scope) 
{
    $scope.click = function() {
            $scope.feedback = '';
            alert ('Your feedback is registered.');
    }
})
</script>
</head>
<body>

<div ng-app="test" ng-controller="test" id='feedback'>
<md-input-container class="md-block">
    <label>Feedback</label>
    <input required="" name="feedback" ng-model="feedback" >
    <div ng-messages="projectForm.feedback.$error" role="alert">
     <div ng-message-exp="['required']">
        This field is required.
    </div>          </div>

   <button ng-click='click();'>click?</button>
</md-input-container>
  </div>

cezar · Accepted Answer · 2017-05-03 07:23:34Z

1

$scope.feedback = [];

(or)

setTimeout(function () {
    $scope.$apply(function () {
        $scope.feedback = [];
    });
}, 1000);

edited May 3, 2017 at 7:23

cezar

12.1k6 gold badges51 silver badges92 bronze badges

answered May 3, 2017 at 7:06

AngularJMK

1,27814 silver badges16 bronze badges

Comments

Darin Cardin · Accepted Answer · 2016-09-16 00:04:38Z

0

Do you have ng-app and ng-controller set? I tested your code on my machine, and it works as long as you have the app and controller set up. Can you make a JSFiddle?

answered Sep 16, 2016 at 0:04

Darin Cardin

7571 gold badge4 silver badges10 bronze badges

Collectives™ on Stack Overflow

How to set scope variable empty in angularjs

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related