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 Directives Directives: ng-click

Posted by Daniel Rose
Daniel Rose
24,219 Points

Angular Directives - Stage 4 Objective, confusion.

I'm a little confused here. The challenge is to set $scope.name to 'Treehouse', and in an earlier video, Alex advised that your wouldn't want to use $scope.name = 'Treehouse', instead use setName(Alex). I've tried a few variations with including the $scope, but i'm unable to get it working with the ng-click directive. I'm guessing i've completely misunderstood the concept, but if anyone can help, would be much appreciated. I don't wan't answers, just a better understanding. Thanks.

index.html 
<!DOCTYPE html>
<html ng-app="myApp">
<head>
  <title>Angular.js</title>
  <script src="js/angular.js"></script>
  <script src="app.js"></script>
</head>
<body ng-controller="myController">

  <p>Hello {{name}}</p>
  <!-- YOUR CODE HERE -->
  <button ng-click="setName('Treehouse')"></button>

</body>
</html>

1 Answer

haunguyen
haunguyen
14,985 Points
haunguyen
haunguyen
14,985 Points

Hi,

Use this line 

 <button ng-click="{{name='Treehouse'}}"></button>

I will attempt to explain what I know, sorry if it is long winded, but you asked for an explanation.

My analogy is that ng-click is like a listener, when you click on it, it will execute what is in the quotes.

There is no javascript file accompanying the challenge. For the front-end, you don't need to use $scope prefix, and that is why it is so difficult to keep track of which word belongs to which section, which then leading unnecessary confusions for us beginners.

In this case, I put the word name inside the curly braces, so angular will treat it as a variable name. In this case, I am assigning the value for the variable using quotes around the string value.

You can't access and use the setName() function because probably there is no such function declared in the controlller (or no backend javascript controller at all in this case), but I think you know that and you were just guessing.

Daniel Rose
Daniel Rose
24,219 Points

Ah, ok. I think i'm understanding it now. Thanks for your help, think I need read up on Angular a lot more to get a grasp of things.

kyle rebstock
kyle rebstock
2,019 Points
kyle rebstock
kyle rebstock
2,019 Points

So strange that what that actually does is update the value before even being clicked. As soon as the page is loaded the value is updated as Treehouse. ???