Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript AngularJS Basics (1.x) Getting Started with Angular Review: Getting Started with Angular

I cannot get the 3/3 to work. I used w3schools to reference console log. I need help. Are all the courses incomplete?

angular.module ('foobar', [ ]) .directive ('customDirective', function ( ) { return { template : 'test' console.log('This is a custom Directive!) }; });

app.js

1 Answer

Balázs Buri
Balázs Buri
8,799 Points

Your original code formatted:

angular.module ('foobar', [ ]) 
    .directive ('customDirective', function ( ) { 
    return { 
        template : 'test' console.log('This is a custom Directive!) //cannot call a function here, youre defining an object 
    }; 
});

First, you're missing a ' at the end of your console.log's parameter. It should look like

console.log('This is a custom Directive!')

Now that we have that out of the way let's look at the real problem.

I've added a comment where the problem is. Your directive's anonymous function is returning an object. Think of this object as the configuration for your directive. Inside an object you must have key-value pairs and they have to be separated by a comma. So after 'test' there should be a comma. But even so your code would still not work. After the comma you'd need to define a new key which is a string followed by a : and then anything that you'd like as a value for that key.

Anyways the challenge states that your directive should immediately do the console.log. If you put in anywhere inside the returned object it will not happen unless your directive is used. So you should move console.log() up before the return and inside your directive's anonymous function. Like this:

angular.module ('foobar', [ ]) 
    .directive ('customDirective', function ( ) { 
    console.log('This is a custom Directive!');
    return { 
        template : 'test'
    }; 
});

It makes more sense now. Your anon function calls console.log() and returns your directive's configuration afterwards.

Hope this helps.

Thank you. I appreciate the narrative. I am angry at myself for not trying this. It was annoying that at the beginning of this course, the questions are requiring us to research answers outside the course. I am willing to accept this but as a new learner of angular, it is a questionable practice. But again I am very appreciative of your response and I hope to move to the next challenge.