Make props accessible without bindings, inspired by React

[dmitriz]

Having seen how easy it is to access Props in React, I can't help to request the same awesome feature in Angular:

<awesome-comp name="'Trump'"></awesome-comp>

I would dream to avoid the clunky binding declarations and have the same level of simplicity:

.component('awesomeComp', {
    template: '<div>You are awesome, Mr. {{$comp.$props.name}}</div>',
})

Opinions?

Make Angular great again.

— Trump on Angular (@realDonaldNG) October 18, 2015

<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

[toddmotto]

Like this idea a lot. However, one thing I think is more beneficial here comes from React's propTypes inspiration as well:

This example makes an assumption that two-way binding is assumed:

.component('counter', {
    bindings: {
        count: angular.scopeType.number
    },
    template: '<div>Count: {{counter.props.count}}</div>',
})

And maybe another idea to implement type validation and binding info:

.component('counter', {
    bindings: {
        count: ['=', angular.scopeType.number]
    },
    template: '<div>Count: {{counter.props.count}}</div>',
})

[gaui]

👍

[valorkin]

Already possible in angular 2 http://victorsavkin.com/post/119943127151/angular-2-template-syntax

[petebacondarwin]

This is yet another reason to start the upgrade to Angular 2.

[toddmotto]

@petebacondarwin Indeed! Excited for those changes. Some form of support for 1.x apps could potentially be considered though, especially large enterprise apps that will gradually be making code upgrades to get closer and closer to 2 as possible before leaving 1.x!

[dmitriz]

@valorkin Does Angular 2 allow the same props-syntax without controller? I could not find it in that article.

[valorkin]

@dmitriz no controller - no problem :)
it is available for directives and components

[dmitriz]

@valorkin Would you mind giving a more detailed description of what you have in mind? How would you implement the above proposals in Angular 2? I don't see it without controller.

[petebacondarwin]

This is similar to #11657
Moving to the ice box for the moment as this is low priority right now.

[LulzAugusto]

Please, take into consideration not wrapping functions when implementing that feature. That would be helpful in scenarios like the one below and to everyone migrating their controllers to isolated components:
http://stackoverflow.com/questions/34958681/what-is-the-best-way-to-pass-functions-between-inner-components-in-angularjs-1-5

[petebacondarwin]

@LulzAugusto - I don't understand your use case. Can you respond to my comments on SO?

[LulzAugusto]

@petebacondarwin I just edited the question. Thanks for your help

[linhuiw]

Does angular 4+ version has this feature? @dmitriz @LulzAugusto