var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.items = [
    {
      type: 'FooA',
      title: 'FooA',
      text: "I am fooA"
    },
    {
      type: 'FooB',
      title: 'FooB',
      text: "I am fooB"
    },
    {
      type: 'FooC',
      title: 'FooC',
      text: "I am fooC"
    },
    {
      type: 'FooE',
      title: 'FooE',
      text: "I am fooE"
    }
  ];
  
  // Define out specialItems
  $scope.specialItems   = ['FooB', 'FooC', 'FooE'];

  // Create an array to stash the first item that fulfills
  // the requirement in showSpecialSection
  $scope.allowedItem    = [];

  $scope.showSpecialSection = function(item) {
    // First we check if the item is in our defined list
    // of special items
    if ($scope.specialItems.indexOf(item) != -1) {

      // Next depending on if allowedItem has anything,
      // we either add it to allowedItem or check if it is
      // already inside allowedItem
      if ($scope.allowedItem.length == 0) {
        $scope.allowedItem.push(item);
        return true;
      }
      else if ($scope.allowedItem.indexOf(item) != -1) {
        return true;
      }
    }
    // return false if all other logic checks failed
    return false;
  }
});
<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <p>Special Case? {{specialShowing}}</p>
    <div ng-repeat="item in items">
        <div class="item-title-section">
            <h1>{{item.text}}</h1>
        </div>
        <div class="item-special-section"
              ng-show="showSpecialSection(item.type)">
              <p>I'm a special case!</p>
              <p>{{item.text}}</p>
        </div>
    </div>
  </body>

</html>
/* Put your css in here */

# Creating Angular Element Once
[StackOverflow Question](http://stackoverflow.com/questions/37092663/creating-angular-element-once)