Binding array to directive variable in AngularJS

You need to change the “@” into “=” and to pass in the array without the {{ }}

like this:

<my-customer-vars value="varForward">
    </my-customer-vars>
<my-customer-vars value="varBack">
    </my-customer-vars>

directive:

directive('myCustomerVars', function($compile) {
    return {
        restrict: 'E',
        scope: {
            value: "="
        },
        template:
        '<div>'+
          '<p class="body-text">Some stuff goes here</p>'+
          '<input type="text" name="firstinput" value="{{value[0]}}"> - '+
          '<input type="text" name="secondinput" value="{{value[1]}}">'+
        '</div>',
        replace: true
    }
});

This is happening because every expression inside a directuve attribute defined by a @ gets evaluated as only as a string, and in the other way it gets evaluated as binding expression. (with 2 way binding, so be careful).