angular2-child-injectors: another way to write individualChild

[ghost]

Hi SStorie. I appreciate your demos. Thanks for providing them.

This is probably not what you are trying to demonstrate with the angular2-child-injectors project, but another way to solve the problem of the ChildComponent sharing scope:

import {Component} from "angular2/core";

import {IdService} from "./id.service";

@Component( {
    selector: 'child',
    template: `
        <div class="child">
            <span><a href="#" (click)="regenerate()">Regenerate</a></span>
            <span>{{guid}}</span>
        </div>
    `
})
export class ChildComponent {

    guid:string;

    constructor(
        private idService: IdService
    )
    {
        this.regenerate(); 
    }

    regenerate() {
        this.idService.regenerate();
        this.guid = this.idService.id;
    }
}

I was glad I was able to do this without having to perform a deep copy with something strange like this.guid = JSON.parse(JSON.stringify(this.idService.id));

I think this is really interesting too, that you wrote from IndividualChildComponent:

    providers: [
        provide(IdService, { useFactory: () => {
            return () => {
                return new IdService();
            }
        }})
    ]

But there is still something bothering me about them having the individual instances of the same service. Do you think there is a better way?

Good job, thanks again for making things!

[sstorie]

Thanks for the comment @jmb-mage. For reference what I was starting to explore was this question:

http://stackoverflow.com/q/36043821/571237

I wanted to see if there was a way to provide different instances to child components from the parent...and it seemed the consensus was no. I was going to write up a blog post about this investigation, but just haven't gotten to it yet.

If I'm understanding this right, your approach can work if the service is just a factory for some value that, once created, is no longer tied to the service that provided it. In my example the GUID created by the service is just to identify the specific instance of the service, and the assumption I was making was that the service itself needed to be unique...not just the value it provides to the consumer.

Am I following your example correctly?

[ghost]

Yes, you are correct.

May I ask the real world scenario where you would want to have a specific instance of a service for each component?

[sstorie]

For Angular I don't have one yet. This was mostly just for exploration :)

However, in IoC containers in the .NET world (where I spend a lot of my time) it's usually possible to say whenever someone request an object from the container, create a new one. That would be the example of a child component "asking" for a dependency in its constructor, and getting a unique instance without having to explicitly put the provider.

To be fair, the .NET containers I've used don't require the concept of hierarchical containers like Angular has built...so I'm not expecting a 1:1 mapping here

[ghost]

I was trying to think of one. Like perhaps some sort of load balancing thing where several table components require their own instance of a service to not slow each other down. Or perhaps a report calculation service that does complex math.

The problem is, in client side programming, almost everything is a singleton anyway since they are all running under one browser. It would be interesting to experiment with this provider factory idea and HTML5 worker threads.

On Wed, May 25, 2016 at 7:04 PM, Sam Storie notifications@github.com wrote:

For Angular I don't have one yet. This was mostly just for exploration :)

However, in IoC containers in the .NET world (where I spend a lot of my time) it's usually possible to say whenever someone request an object from the container, create a new one. That would be the example of a child component "asking" for a dependency in its constructor, and getting a unique instance without having to explicitly put the provider.

To be fair, the .NET containers I've used don't require the concept of hierarchical containers like Angular has built...so I'm not expecting a 1:1 mapping here

— You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub https://github.com/sstorie/experiments/issues/2#issuecomment-221733779

[sstorie]

Yeah, or if each service maintained some sort of internal state that you didn't want to share across instances. If I come across a real case I'll make sure to put that here, and please do the same.

[sstorie]

Just to close the loop on this issue, I did manage to get that blog post written:

https://blog.sstorie.com/experimenting-with-angular-2-dependency-injection/