npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

interactr.ng.resolver

v1.2.2

Published

Interactr resolver using Angular dependency injection container

Downloads

14

Readme

Interactr.ng.resolver

Interactr Resolver using Angulars Dependency Injection Container.

Getting started

First thing you need to do is to register the interactor as a provider. Then you need to register the use cases and middleware as Injection Tokens.

Create injection Tokens

export const SEARCH_USECASE
  = new InjectionToken<Interactor<SearchUseCase, SearchOutputPort>>('search');

app.module provider registration


export function resolverFactoryFunction () {

  const resolver = new NgResolver(ServiceLocator.injector);
  
  resolver.registerInjectionToken(SEARCH_USECASE, SearchtUseCase.name);

  return resolver;
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    AppRoutingModule,
  ],
  providers: [
    {
      provide: Hub,
      useClass: InteractorHub
    },
    {
      provide: Resolver,
      useFactory: resolverFactoryFunction,
    },
    {
      provide: SEARCH_USECASE,
      useClass: SearchInteractor
    },
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(private injector: Injector) {
    ServiceLocator.injector = this.injector;
  }
}

One thing to note here especially is how we inject the "Injector" into our Resolver. To make this work we create a ServiceLocator with a static member that holds a reference to the Injector instance. In our resolverFactoryFunction we then pass that reference as parameter to the resolver.

There are possibly better ways of doing this. If you have any good ideas please let me know through a PR <3

Registration in detail

As Angulars DIC uses the concept of 'Injection Tokens' to make a lot of the magic of Dependency Injection work when transpiled to javascript we need to create injection tokens and then store them in a clever way so we can reference them when we want to resolve interactors and middleware.

Registrating Use Cases

First we need to create a Injection Token

const SEARCH_USECASE
  = new InjectionToken<Interactor<SearchUseCase, SearchOutputPort>>('search');

Then we need to Register the InjectionToken with our Resolver, the last parameter is needed to for the resolver to figure out which injection token to use for the given usecase.

resolver.registerInjectionToken(SEARCH_USECASE, SearchtUseCase.name);

And finally, we need to register a provider for our interactor with the Angular Injector.

{
    provide: SEARCH_USECASE,
    useClass: SearchInteractor
},

Registrating Middleware

Token:

const SEARCH_PIPELINE =
  new InjectionToken<Middleware<SearchUseCase, SearchOutputPort>>('searchpipeline');

Register

resolver.registerMiddlewareInjectionToken(SEARCH_PIPELINE, SearchUseCase.name);

Providers: (Multiple)

{
    provide: SEARCH_PIPELINE,
    useClass: Middleware1,
    multi: true
},
{
    provide: SEARCH_PIPELINE,
    useClass: Middleware2,
    multi: true
},

Global Middleware

The Injection Token for the blobal pipeline for global middlewares are different from interacts and a use case pipeline in that it they won't be resolved by the resolver using a use case as key For that reason all global middleware are registered to the same token so we only need to register one.

Token:

const GLOBAL_PIPELINE
  = new InjectionToken<GlobalMiddleware>('globalpipeline');

Register

 resolver.registerGlobalMiddlewareInjectionToken(GLOBAL_PIPELINE);

Providers: (multiple)

{
    provide: GLOBAL_PIPELINE,
    useClass: ExceptionMiddleware,
    multi: true
},
{
    provide: GLOBAL_PIPELINE,
    useClass: LogMiddleware,
    multi: true
}