I am using the html element to call a template that contains inputs. This gets used several times on the page. How can I differentiate between them using an attribute and/or index, to populate each respective ng-model?

JS Code:

```
angular.module('myModule').directive('address', function () {
  return{
    restrict: 'E',
    replace: true,
    templateUrl: '/address.tpl.html',
    scope: {
      address: '=',
      form: '='
    },
    link: function (scope, el, attrs) {
      scope.isRequired = attrs.optional === undefined;
    }
  };
});

```

Main page HTML code:

```
<p>My Address</p>      <address></address>
<p>Extra Address 1</p> <address></address>
<p>Extra Address 2</p> <address></address>
<p>Your Address</p>    <address></address>

```

There can be any number of extra addresses.

Address.tpl.html HTML code:

```
  <ng-form name="addressForm">
    <label>Postcode:</label> 
    <input name="postcode" type="text" ng-model="address.postcode"/>
  </ng-form>

```

Obviously, this doesn't help me get to the values, as each instance of the input will have the same ng-model: $scope.address.postcode. Ideally, I am looking to put an attribute in the address element that will mean I can define the name of the ng-model as address.myAddress.postcode or address.extraAddress6.postcode.

EDIT: Now that I have the answer, I've noticed that the necessary code is already in the JS file. That address: '=' was the data-binding I needed.

Main page HTML code (New code):

```
<p>My Address</p>      <address address="my"></address>
<p>Extra Address 1</p> <address address="extra1"></address>
<p>Extra Address 2</p> <address address="extra2"></address>
<p>Your Address</p>    <address address="your"></address>

```

I can now access the scope value of ng-model="address.postcode" using $scope.my.postcode and $scope.extra1.postcode, etc etc.