import {Component, NgModule} from '@angular/core'
import {render, screen} from '@testing-library/angular'
import {ngMocks} from 'ng-mocks'
@Component({
selector: 'app-parent-component',
template: '<app-child-component></app-child-component>',
})
class ParentComponent {}
@Component({
selector: 'app-child-component',
template: '<p>Child component</p>',
})
class ChildComponent {}
@NgModule({
declarations: [ParentComponent, ChildComponent],
})
export class AppModule {}
describe('ParentComponent', () => {
it('should not render ChildComponent when shallow rendering', async () => {
const dependencies = ngMocks.guts(null, AppModule, ParentComponent)
await render(ParentComponent, dependencies)
expect(screen.queryByText('Child component')).toBeNull()
})
})
import { Component, Input } from '@angular/core'; // First, import Input
export class ItemDetailComponent {
@Input() item = ''; // decorate the property with @Input()
}
import { Component, EventEmitter, Input, Output } from '@angular/core';
@Component({
selector: 'app-voter',
template: `
<h4>{{name}}</h4>
<button type="button" (click)="vote(true)" [disabled]="didVote">Agree</button>
<button type="button" (click)="vote(false)" [disabled]="didVote">Disagree</button>
`
})
export class VoterComponent {
@Input() name = '';
@Output() voted = new EventEmitter<boolean>();
didVote = false;
vote(agreed: boolean) {
this.voted.emit(agreed);
this.didVote = true;
}
}
import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core';
@Directive({ selector: '[appUnless]'})
export class UnlessDirective {
}
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { singleSpaAngularElements } from 'single-spa-angular/elements';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
const lifecycles = singleSpaAngularElements({
template: '<app-custom-element />',
// We can actually not rely on the `zone.js` library, our custom element
// will behave itself as a zone-less application.
bootstrapFunction: () =>
platformBrowserDynamic().bootstrapModule(AppModule, { ngZone: 'noop' }),
});
export const bootstrap = lifecycles.bootstrap;
export const mount = lifecycles.mount;
export const unmount = lifecycles.unmount;