title: Angular data binding conditional inside ngIf
body: <p>I am trying to display recipes within a certain food category, but not having luck. I am looping this through an array of recipes inside a parent component.</p>
  
  <pre><code>&lt;div class="row"&gt;
    &lt;div class="col-xs-8" *ngIf="{{ recipe.category }} === mexican"&gt;
        &lt;h4 class="list-group-item-heading"&gt;{{ recipe.name }}&lt;/h4&gt;
        &lt;p class="list-group-item-text"&gt;{{ recipe.description }}&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="col-xs-4"&gt;
        &lt;img src="{{ recipe.imagePath }}" alt="{{ recipe.name }}" class="img-responsive"&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p></p>