GithubHelp home page GithubHelp logo

Comments (4)

jschwarty avatar jschwarty commented on August 16, 2024

my.component.sandbox.ts

. . .

// You would need to handle creating service instance:
const myServiceInstance = new MyService();

. . .

export default sandboxOf(MyComponent)
  .add('example', {
    template: `<my-component [service]="theService"></my-component>`,
    context: {
      theService: myServiceInstance
    }
  });

Right now there is no other way to do this in Playground. It's not really something that has come up since most service architecture is handled via the dependency injection pattern in Angular applications.

from angular-playground.

AlDrag avatar AlDrag commented on August 16, 2024

Sorry if I am overlooking this, but that solution doesn't work with injectables right? As I need an Angular Injectable service.

Edit: No problem. Thanks for the help. Maybe it would be better to sandbox with a parent component that contains my child component.

from angular-playground.

jschwarty avatar jschwarty commented on August 16, 2024

Do you have an example you could post in here that I can look at?

Right now I can't see a way to be able to get a hold of an injected service (instantiated by Angular) and then hand it to the sandboxed component via an Input. If that sandboxed component got the service from constructor injection then you could provide that service or a mock of it at either the sandboxOf or the add method level. Not sure that there is a way right now to get a service onto that context of the host component to then be able to pass it to the Input without newing that up manually. I mean, there might be a way...but it'd be complicated.

from angular-playground.

AlDrag avatar AlDrag commented on August 16, 2024

I solved it. Just decided to make a mock service as you suggested.

from angular-playground.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.