Comments (4)
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.
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.
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.
I solved it. Just decided to make a mock service as you suggested.
from angular-playground.
Related Issues (20)
- Jest is not in the devDepenendencies HOT 1
- ERROR angular-playground.ts(10,25) - Error during template compile of 'PlaygroundModule' [0] (7.1.1) HOT 2
- How to add a global language selector that can be used in all sandboxes HOT 1
- --check-visual-regressions should fail when some snapshots are missing HOT 1
- "playground-app" component must have default change detection HOT 1
- Getting errors after update to Angular 12 and Angular Playground 8.1.0 HOT 6
- Example playground not running, not updated to v8.1.1 HOT 1
- Unable to start playground, scss loading error HOT 1
- Can't resolve 'core-js/proposals/reflect-metadata' in Angular 13 HOT 2
- Component never resolves items from AsyncPipe HOT 1
- npm 8 dependency fails on outdated rxjs packages HOT 1
- check visual regression fails HOT 4
- Inflexible Assignment to <title> Element
- Custom builder HOT 1
- Upgrade to Angular 14 gives ng serve 'Unknown argument: publicHost' error when running playground HOT 2
- Playground not showing icon outline of Material
- --check-visual-regressions not working in Jest 28 HOT 9
- Angular 15 HOT 1
- Add explanation to readme about the distinction between playground and storybook HOT 1
- Documentation missing HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from angular-playground.