angularjs - Passing scope parameter to component

Question

We can pass scope parameter to a directive

app.directive('appInfo', function() { 
  return { 
    restrict: 'E', 
    scope: { 
      info: '=' 
    }, 
    templateUrl: 'js/directives/appInfo.html' 
  }; 
});

and use it as follows in a view:

<app-info info="app"></app-info>

A component can be used as a directive too:

<component-info></component-info>

But can we pass to it a scope parameter same as info="app" ?

Yes, of course. Component is just a special case of directive. — dfsq
– dfsq, Commented Mar 24, 2017 at 13:46

Nikolaj Dam Larsen · Accepted Answer · 2017-03-24 13:47:43Z

2

Yes, for a component you'll use bindings instead of scope. So your component definition will look somewhat like this:

app.component('componentInfo', { 
    bindings: { 
        info: '=' 
    },
    // ... and so on
});

answered Mar 24, 2017 at 13:47

Nikolaj Dam Larsen

5,7146 gold badges37 silver badges46 bronze badges

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

3 Comments

EddyG Over a year ago

How to pass this parameter to the controller?

Nikolaj Dam Larsen Over a year ago

This will already be available in your controller through 'this.info'.

EddyG Over a year ago

Thanks. I forgot to add "this" :p

Collectives™ on Stack Overflow

angularjs - Passing scope parameter to component

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related