title: Angular.js reuse partial for different data
body: <p>I am trying to reuse the same partial to display data. I want to display girls winners on the left side of the screen using that template and boys on the right side. Unfortunately data is not displaying in the template, so I am assuming I am not passing it correctly. Is it possible to reuse the same template without having directive for it as it is described in <a href="http://jsfiddle.net/api/post/library/pure/" rel="nofollow">http://jsfiddle.net/api/post/library/pure/</a> ? There will be much more info to display in that template. This is second project I am trying with angular, so your advise is highly appreciated. Thank you</p>
  
  <p>Main screen:</p>
  
  <pre><code>&lt;section id="data"&gt;
     &lt;div class="leftSection left" &gt;
       &lt;div ng-model="leftWinner"  ng-include src="'partials/winner.html'"&gt;&lt;/div&gt;
     &lt;/div&gt;
    &lt;div class="middleSection left" ng-include src="'partials/middleImage.html'"&gt;&lt;/div&gt;
      &lt;div class="rightSection left"&gt;
       &lt;div  ng-model="rightWinner"  ng-include src="'partials/winner.html'"&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>Template:</p>
  
  <pre><code>&lt;section class="winnerContaner"&gt;
    &lt;div class="title"&gt;{{fullName}}&lt;/div&gt;
    &lt;div class="title"&gt;{{lastName}}&lt;/div&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>Controller where I am specifying what model has what data: </p>
  
  <pre><code>            $scope.data=testData;
  
              $http.get('js/options.json').success(function(data) {
                  $scope.options = data;
                  $scope.leftWinner = $scope.data.years[0].winners[$scope.options.leftSide];
                  $scope.rightWinner = $scope.data.years[0].winners[$scope.options.rightSide];
              });
  </code></pre>