Why isn't this directive template interpolated?

Question

What am I missing?

app.directive('summaryAddress', [function () {

    return {
        scope: {
           address: '=summary-address'
        },
        template: "<h2>Billing Address</h2>" +
            "<span>{{address.flatNumber}}</span>"
    };

}]);

The output is just...

{{address.flatNumber}}

You are missing a live reproduce scenario using http://plnkr.co/ or similar. — pkozlowski.opensource, Jul 23 '13 at 13:09
;) The problem seems to be that '=summary-address' refers to the attribute directive. How do you map a scope element to a value assigned to the directive attribute? — Ian Warburton, Jul 23 '13 at 13:28
Check console. I bet you have some jus errors. But without plnkr we can't help you — Valentyn Shybanov, Jul 23 '13 at 13:29
I just told you where the problem was! The answer is below. :) — Ian Warburton, Jul 23 '13 at 13:37

Ian Warburton · Accepted Answer · 2013-07-23T18:45:49.103

0

Scope mapping needs to use the normalized camel case name of the attribute and not the form that it appears in the mark up.

pobo.directive('summaryAddress', [function () {

    return {
        scope: {
            address: '=summaryAddress'
        },
        template: "<h2>Billing Address</h2>" +
            "<span>{{address.flatNumber}}</span>"
    };

}]);

edited Jul 23 '13 at 18:45

answered Jul 23 '13 at 13:37

Ian Warburton

15,170
23
107
189

Why isn't this directive template interpolated?

1 Answers1