AngularJs - Use filter with ng-bind in directive

Question

I have a simple directive like that one :

Directive js :

.directive('pageHeader', function() {
    return {
        restrict: 'E',
        scope: {
            title: '=',
            subtitle : '='
        },
        templateUrl: 'pages/templates/pageHeader.html'
    };
})

Directive html :

<div class="page-header">
    <span class="header-view-title" ng-bind="title"></span>
    <span class="header-view-subtitle" ng-bind="subtitle"></span>
</div>

And i'm using that directive like this way :

<page-header title="'The blue elephant'" subtitle="'is walking to the street'"></page-header>

There's a way to passa a filter to the 'title' and 'subtitle', and use that filter. I tried like this, but failed :

<page-header title="The blue elephant | myfilter" subtitle="is walking to the street | myfilter"></page-header>

Did someone already need do something like that ?

dfsq · Accepted Answer · 2014-10-08 12:35:51Z

1

Thy this instead:

title="'The blue elephant' | myfilter"
       ^-- note quotes --^

answered Oct 8, 2014 at 12:35

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

dfsq Over a year ago

Without quotes Angular thinks that The blue elephant is variable, but $scope['The blue elephant'] is undefined.

Raduan Santos Over a year ago

I was trying with quotes around the filter too, like that : title="'The blue elephant | myfilter'", causing probably a undefined object

Collectives™ on Stack Overflow

AngularJs - Use filter with ng-bind in directive

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related