CODEWITHSUNDEEP
javascriptangularjs
wendellmva
wendellmva

Reputation: 1944

Angular two way binding does not appear to work while the documentation says that it should

I am trying to use the value of $scope.commentText but when I call addComment() the scoped variable is empty eventhough it is bound. As a workaround I pass the commentext as a parameter value that works but still it should work. My question how do I clear out commentText which is bound to a text input ... but it does not work as expected either. I looked around... and I am missing something cause I am doing exactly as the docs tell me how to. So... anyone? 

  $scope.user = "WM";
  $scope.commentText='';
  $scope.addComment = function(plan, commentText) {
    console.log(commentText)
    plan.comments.push({text:commentText, user:$scope.user);
    commentText=null;
    $scope.commentText=null;
  };

and the view:

        <form ng-submit="addComment(plan, commentText)">
          <div class="input-group">
            <input class="form-control" type="text" ng-model="commentText" size="30" placeholder="add new comment here">
            <span class="input-group-btn">
              <input class="btn btn-primary" type="submit" value="add">
            </span>
          </div>
        </form>

plunker: http://plnkr.co/edit/lG0Ckjctsj9Hu83lTydh?p=preview

Upvotes: 0

Views: 55

Answers (1)

Jorg
Jorg

Reputation: 7250

use this.commentText=null; instead of $scope.commentText=null in the addComment method.

Updated your plunkr

Edit: I started typing up an explanation when I noticed there is an excelent one right here: 'this' vs $scope in AngularJS controllers

Upvotes: 2

Related Questions