why binding not working in angular js?

Question

  <div class="popover-content" ng-click="updateHeader('jack')">

When this div is clicked it calls a function which makes a get request and

var app = angular.module('myApp', []);
app.controller('myContoller', function($scope, $http) {

$scope.username = "";
$scope.updateHeader = function(username) {

 var url = "api?user="+ username;
 $http.get(url)

 .then(function(response) {
   $scope.username = response.data.plugUser;
   console.log($scope.username);
   $scope.scrollableChatItems = response.data.msg;

       });
   };

};

Even though the console.log is working it is printing the username in the console, It is not updating in the username.why the username is not updating?

<div class="container" ng-controller="myController">
                    <h3 class="content-box-header">
                        {{username}}
                    </h3>

Is the "popover-content" div inside the "container" div with the ng-controller??? — Danilo Velasquez
– Danilo Velasquez, Commented Oct 13, 2016 at 18:06

Sajeetharan · Accepted Answer · 2016-10-13 18:04:12Z

2

Make sure your div is placed inside the ng-controller div

   <div class="container" ng-controller="myController">
      <div class="popover-content" ng-click="updateHeader('jack')">
         <h3 class="content-box-header">
           {{username}}
        </h3>
       </div>
    </div>

answered Oct 13, 2016 at 18:04

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

kevin Over a year ago

thanks,It works.but why it was not working before.ng-init is for setting the default value.It has to called the function but why it is not setting the username

clcastro87 · Accepted Answer · 2016-10-13 18:17:16Z

0

Fix typo your controller name. myContoller

var app = angular.module('myApp', []);
app.controller('myController', function($scope, $http) {

$scope.username = "";
$scope.updateHeader = function(username) {

 var url = "api?user="+ username;
 $http.get(url)

 .then(function(response) {
   $scope.username = response.data.plugUser;
   console.log($scope.username);
   $scope.scrollableChatItems = response.data.msg;

       });
   };

};

answered Oct 13, 2016 at 18:17

clcastro87

415 bronze badges

Collectives™ on Stack Overflow

why binding not working in angular js?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related