Exercise 2 Hello AngularJS II


#1



I honestly have no idea what to do with the second instruction. I'm totally stuck with how to add in the promo part. I tried adding it to everything that has the word title and only parts. I tried every combination possible with attaching it to the word title and nothing works like it should, but the exercise lets me go on. I placed in the code for displaying promo, but it doesn't display.

tl;dr I don't know what I am doing...for second instruction. please help me.

The MainController.js is done a few times so that you can see my work.

https://www.codecademy.com/en/courses/learn-angularjs/lessons/your-first-app/exercises/your-first-app-hello-angularjs-ii?action=lesson_resume

Index.html code below

<!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=Roboto:500,300,700,400' rel='stylesheet' type='text/css'>
    <link href="css/main.css" rel="stylesheet" />

    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
  </head>
  <body ng-app="myApp">
    <div class="header">
      <div class="container">
        <h1>Book End</h1>
      </div>
    </div>

    <div class="main" ng-controller="MainController">
      <div class="container">

        <h1>{{ title }}</h1>
        <h2>{{ promo }}</h2>

        <div class="col-md-6">
          <div class="thumbnail">
            <img src="img/the-book-of-trees.jpg">
            <p class="title"> </p>
            <p class="price"> </p>
            <p class="date"> </p>
          </div>
        </div>

      </div>
    </div>

    <div class="footer">
      <div class="container">
        <h2>Available for iPhone and Android.</h2>
        <img src="https://s3.amazonaws.com/codecademy-content/projects/shutterbugg/app-store.png" width="120px" />
        <img src="https://s3.amazonaws.com/codecademy-content/projects/shutterbugg/google-play.png" width="110px" />
      </div>
    </div>


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

    <!-- Controllers -->
    <script src="js/controllers/MainController.js"></script>
  </body>
</html>

MainController.js code below. Original.

app.controller('MainController', ['$scope', function($scope) { $scope.title = 'Top Sellers In Cacti';
}]);

MainController.js below. One of my creations.

app.controller('MainController', ['$scopepromo', function($scopepromo) { $scopepromo.title = 'Top Sellers In Cacti';
}]);

One of my other maincontroller.js creations.

app.controller('MainController', ['$scope', function($scopepromo) { $scopepromo.title = 'Top Sellers In Cacti';
}]);


#2

Hello @cactusking0 ,

This is how you attach promo to $scope. You could put string of your choice.

Put

  $scope.promo = 'The most popular books this month.';

just after

 $scope.title = 'Top Sellers In Cacti';

#3

Hey thanks a lot. It's been a long morning already and you really helped out.


#4

You're welcome.

Have fun coding! :slight_smile:


#5

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.