title: angular directive for each value in parent array keep in sync
body: <p>I have a parent object containing an array and for each value I render a directive passing in the value via an isolate scope. For this simple demo I just add the object to a controller:</p>
  
  <pre><code>  $scope.schedule = {
      __type: "Fixed",
      ids: [101, 102, 103]
    }
  })
  </code></pre>
  
  <p>And the directive:</p>
  
  <pre><code>    app.directive('picker', function() {
  
    return {
        scope:{
          import: '='
        },
        template:'&lt;input ng-model="import" &gt;'
    }
  });
  </code></pre>
  
  <p>The html:</p>
  
  <pre><code>  &lt;div ng-repeat="i in schedule.ids"&gt;
      &lt;picker import="i"&gt;&lt;/picker&gt;  Bind: {{i}}
    &lt;/div&gt;
  </code></pre>
  
  <p>My real world issue is I have a datepicker directive that needs to be reusable so for each of the datepickers rendered, I'd like the underlying / original array to stay in sync as the values are changed. Am I going about this wrongly?</p>
  
  <p>As you can see in the fiddle my rendered directives stay in sync with their isolate scope values but the underlying array they came form does not, plunk below:</p>
  
  <p><a href="https://plnkr.co/edit/Nt9QwiBmlaW3PKPo8XRN?p=info" rel="nofollow">https://plnkr.co/edit/Nt9QwiBmlaW3PKPo8XRN?p=info</a></p>
  
  <p>Thanks</p>