Info="app" vs. info="{{ app.title }}" in exercise 4

Hello I’m Nathan,

I was able to figure out why my code wasn’t displaying correctly with the help of a friend but I am still having some trouble understanding why what I did worked. This is my working code from the index.html file in exercise 4…

`<div class="main" ng-controller="MainController">
      <div class="container">
         <div ng-repeat="app in apps" class="card">
          <app-info info="app"></app-info>
        </div>

my instinct in this instance however was to use this code instead which didn’t work…

<div class="main" ng-controller="MainController">
      <div class="container">
         <div ng-repeat="app in apps" class="card">
          <app-info info="{{ app.title }}"></app-info>
        </div>

using this code gave me the green check mark passing me to the next section but it did not display properly. What displayed in my wrong code was …

{{ info.title }}
{{ info.developer }}

I never would have in a million years tried to simply use info=“app” as opposed to info="{{ app.title }}" if my friend hadn’t helped me. He tried to explain why this is the way it is but he couldn’t explain it to me in a way I could understand. Can anyone out there help me? It would be most appreciated if you could help me wrap my brain around this. It’s not gelling.

All we need to provide app-info is the scope, app. The directives file contains the attributes.

Oh wow! That means I didn’t understand where the value’s were coming from before. I had been thinking info= had been looking at the title attribute when it had actually been looking at the value of the scope. Thank you! I get it.

1 Like