title: AngularJS directive data is being overwritten
body: <p>I have made my own type-ahead directive that auto-populates with some names.  I have the same type-ahead on my page in two different modals.  One of them needs to get every name while the other one only needs to get some of the names.  Which ever type-ahead gets loaded last over writes the first type-ahead's data.  So if I load the one that is supposed to get some names first and the one that gets all the names second.  Both of them grab all the names.</p>
  
  <p>Any help would be greatly appreciated.</p>
  
  <p>Here is my directive: </p>
  
  <pre><code>templates.directive("referralTypeAhead", function (Referrals,AlertFactory) {
  return {
  restrict:"EA",
  replace: true,
  require:'ngModel',
  // scope: {everyone: "@"},
  template: '&lt;input type="text" typeahead="patient.id as patient.plast + \', \' + patient.pfirst + \' \' + patient.mi for patient in patients | filter:$viewValue | limitTo:8" typeahead-min-length="3" typeahead-editable="false" typeahead-input-formatter="formatLabel($model)" class="form-control" /&gt;',
  link: function(scope, element, attrs, ngModel) {
  
          var every = attrs.everyone ? attrs.everyone : "false";
          if (everyone === "false") {
            Referrals.getSomeNames({everyone:every}).$promise.then(function(result) {
              var patients = result;
              for (var i = 0; i &lt; patients.length; ++i) {
                if (!patients[i]['mi']) {
                  patients[i]['mi'] = '';
                }
              }
              scope.patients = patients;
            },function(result) {
              AlertFactory.addAlert('warning','ERROR: Unable to load data for the referral-type-ahead');
            });
          }
          else {
            Referrals.getAllNames({everyone:every}).$promise.then(function(result) {
              var patients = result;
              for (var i = 0; i &lt; patients.length; ++i) {
                if (!patients[i]['mi']) {
                  patients[i]['mi'] = '';
                }
              }
              scope.patients = patients;
            },function(result) {
              AlertFactory.addAlert('warning','ERROR: Unable to load data for the referral-type-ahead');
            });
          }
  
          scope.formatLabel = function(model) {
            if (scope.patients) {
              for (var i = 0; i &lt; scope.patients.length; ++i) {
                if (scope.patients[i].id == model) {
                  return scope.patients[i].plast + ', ' + scope.patients[i].pfirst + ' ' + scope.patients[i].mi;
                }
              }
            }
          };
       }
     };
  });
  </code></pre>
  
  <p>Here is my html:</p>
  
  <pre><code>&lt;referral-type-ahead everyone="false" ng-model="patient.id"&gt;&lt;/referral-type-ahead&gt;
  
  &lt;referral-type-ahead everyone='true' ng-model="patient.id"&gt;&lt;/referral-type-ahead&gt;
  </code></pre>
  
  <p>I don't understand why the second set of data is overwriting the first set.</p>