Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript AngularJS An Introduction to Two-Way Data Binding Two-Way Binding: watchers

Posted by Elaine Matthias
Elaine Matthias
1,310 Points

Error messages for learning challenges are unhelpful. I've been working on the same challenge for over a week... Pls hel

I'm reworking my code, rewatching the video, watching YouTube videos and I continue to receive the same error message. Can anyone provide guidance?

angular.module('myApp', []) .controller('myController', function ($scope, $http) { $scope.user = {name: 'Alex', id: 123};

$scope.$watch('user.id', function(newValue, oldValue){
        if (newValue) {
            api.getUserData($scope.user);
        }

  getUserData = function (id) {
    console.log('Getting user with ID: ' + id);
 }

}); });

Bummer! You need to create a watcher for the user.id property, and call getUserData within it.

app.js 
angular.module('myApp', [])
.controller('myController', function ($scope, $http) {
  $scope.user = {name: 'Alex', id: 123};

    $scope.$watch('user.id', function(newValue, oldValue){
            if (newValue) {
                api.getUserData($scope.user);
            }

      getUserData = function (id) {
        console.log('Getting user with ID: ' + id);
     } 

  });
});
index.html 
<!DOCTYPE html>
<html ng-app="myApp">
<head>
  <title>Angular.js</title>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
  <script src="app.js"></script>
</head>
<body ng-controller="myController">

  <input type="text" ng-model="user.id" />

</body>
</html>
Ira Bradley
Ira Bradley
12,976 Points

Try this:

angular.module('myApp', [])
.controller('myController', function ($scope, $http) {
  $scope.user = {name: 'Alex', id: 123};

  getUserData = function (id) {
    console.log('Getting user with ID: ' + id);
  }
  $scope.$watch('user.id', function(id){  
    if(id){
      getUserData(id);
    }
  });
});