Angular js ng-click issue

Question

I want to read a Json object, then I put the element of Json in my html (user interface), the problem, that the element appears in the view only when I click twice on the button. this is the function in the controllers:

      $scope.openfile=function ()
     {


    $scope.db.select("items", {
       "id": {
      "value": $routeParams.id,
          },
         }).then(function(results) {
    var parser = new xml2js.Parser();
               fs.readFile(results.rows.item(0).path,             function(err, data) {
       parser.parseString(data, function (err, result) {
       if (err == null)
      {
   $scope.descriptionApp=result.widget.description[0];
   }
     });
     });
      }

html :

       <label class="control-label" for="inputDefault"></label>
        <textarea type="text" class="form-control" id="description"  ng-model="descriptionApp"></textarea>
        <a class="btn btn-primary"  ng-click="openfile()">Open File</a>

Answer 1

from what I see, you are trying to update the $scope from a function outside of angular's scope - fs.readFile(). In cases like that you need to use $scope.$apply to wrap the operation. Do this:

    fs.readFile(results.rows.item(0).path,function(err, data) {
       parser.parseString(data, function (err, result) {
       if (err == null)
      {$scope.$apply(function(){
   $scope.descriptionApp=result.widget.description[0];
});
   }
     });
     });