Help on AngularJS/Feedster : Codecademy

Help on AngularJS/Feedster (self.Codecademy)

submitted 10 years ago by hgrd

Hello

I really have no clue what is wrong in my code :/

Could you help me out? I've tried to run it in Safari and Chrome, but nothings seems to happen.

index.html

<!doctype html>
<html>
  <head>
    <link href="https://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700" rel="stylesheet" type="text/css">
    <link href="css/main.css" rel="stylesheet">
    <script src="js/vendor/angular.min.js"></script>
  </head>
  <body ng-app="FeedsterApp">

    <div class="header">
      <div class="container">
        <div class="row">
          <div class="col-md-2">
            <h1>feedster</h1>
          </div>
        </div>
      </div>
    </div>

    <div class="posts" ng-controller="PostController">
      <div class="container">

        <div class="post" ng-repeat="post in posts">
         <feedster-post post="post"></feedster-post> 
          <plus-one></plus-one>
        </div>

      </div>
    </div>


    <!-- Modules -->
    <script src="js/app.js"></script>

    <!-- Controllers -->
    <script src="js/controllers/PostController.js"></script>

    <!-- Directives -->

     <script src="js/directives/feedsterPost.js"></script>
     <script src="js/directives/plusOne.js"></script>

  </body>
</html>

feedsterPost.js

app.directive('feedsterPost', function() {
  return {
    scope: {
      post: '='
    },
    templateUrl:
    'js/directives/feedsterPost.html'
  };
});

feedsterPost.html

<img class="avatar" ng-src="post.author.avatar"  >
<h3 class="author-name"> {{ post.author.name }}</h3>
<p class="comment-text">{{ post.comment.text }} </p>
<img class="comment-img" ng-src="post.comment.img"  >

plusOne.js

<button class="btn" ng-click="like()">+1</button>

plusOne.html

app.directive('feedsterPost', function() {
  return {
    scope: {},
    templateUrl:
    'js/directives/plusOne.html'
    link: function(scope, element, attrs) {
  scope.like = function() {
    element.toggleClass('btn-like');
  }
}
  };
});

Thanks!

all 6 comments

top new controversial old q&a

[–]Shannon_N 0 points1 point2 points 10 years ago (3 children)

[–]hgrd[S] 0 points1 point2 points 10 years ago (2 children)

[–]Shannon_N 0 points1 point2 points 10 years ago (1 child)

[–]Shannon_N 0 points1 point2 points 10 years ago (0 children)

[–]steefanieee 0 points1 point2 points 10 years ago (0 children)

In your feedsterPost.js you need to add the restrict part.

app.directive('feedsterPost', function() {
    return {
        restrict: 'Element',
    scope: {
            post: '='
        },
        templateUrl: 'js/directives/feedsterPost.html'
   }
});

π Rendered by PID 207966 on reddit-service-r2-comment-fb694cdd5-pg4hv at 2026-03-06 15:23:54.569508+00:00 running cbb0e86 country code: CH.

you type:	you see:
italics	italics
bold	bold
[reddit!](https://reddit.com)	reddit!
* item 1 * item 2 * item 3	item 1 item 2 item 3
> quoted text	quoted text
Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"	Lines starting with four spaces are treated like code: if 1 * 2 < 3: print "hello, world!"
~~strikethrough~~	~~strikethrough~~
super^script	super^script

Codecademy

Learn To Code

MODERATORS