- Angular directives decorator
- @Hostbinding with and without getters
- @Hostlistener: concept, $event, exportAs (why?)
- attribute directives
- structural directives
- replace *ngIf by more explicit syntax
- [FC] templateref: Represents an embedded template that can be used to instantiate embedded views. To instantiate embedded views based on a template, use the ViewContainerRef method createEmbeddedView(). Access a TemplateRef instance by placing a directive on an ng-template element (or directive prefixed with *). The TemplateRef for the embedded view is injected into the constructor of the directive, using the TemplateRef token. You can also use a Query to find a TemplateRef associated with a component or a directive.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { isMainThread } from "worker_threads"; | |
fdescribe("Async testing examples", () => { | |
it("Asynchronous test example with jasmine done()", (done: DoneFn) => { | |
let test = false; | |
setTimeout(() => { | |
console.log("running assertions"); | |
test = true; | |
expect(test).toBeTruthy(); | |
done(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
describe('CoursesCardListComponent', () => { | |
let component: CoursesCardListComponent; | |
let fixture: ComponentFixture<CoursesCardListComponent>; | |
let el: DebugElement; | |
beforeEach(async(() => { | |
TestBed.configureTestingModule({ | |
imports: [CoursesModule] | |
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
describe("HomeComponent", () => { | |
let fixture: ComponentFixture<HomeComponent>; | |
let component: HomeComponent; | |
let el: DebugElement; | |
let coursesService: any; | |
const beginnerCourses = setupCourses().filter( | |
course => course.category == "BEGINNER" | |
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
describe('CoursesService', () => { | |
let coursesService: CoursesService, | |
httpTestingController: HttpTestingController; | |
beforeEach(() => { | |
TestBed.configureTestingModule({ | |
imports: [ | |
HttpClientTestingModule |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
describe('CalculatorService', () => { | |
let calculator: CalculatorService, | |
loggerSpy: any; | |
beforeEach(()=> { | |
console.log("Calling beforeEach"); | |
loggerSpy = jasmine.createSpyObj('LoggerService', ["log"]); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component } from '@angular/core'; | |
import { | |
ComponentFixture, | |
TestBed, | |
TestModuleMetadata | |
} from '@angular/core/testing'; | |
import { constants } from './favorite-icon.constants'; | |
import { FavoriteIconDirective } from './favorite-icon.directive'; | |
import { getStarElement, doClassesMatch } from '../../testing'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { DebugElement } from '@angular/core'; | |
import { | |
ComponentFixture, | |
fakeAsync, | |
TestBed, | |
tick | |
} from '@angular/core/testing'; | |
import { By } from '@angular/platform-browser'; | |
import { NoopAnimationsModule } from '@angular/platform-browser/animations'; | |
import { BrowserDynamicTestingModule } from '@angular/platform-browser-dynamic/testing'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component } from '@angular/core'; | |
import { ComponentFixture, TestBed } from '@angular/core/testing'; | |
import { ShowContactsDirective } from './show-contacts.directive'; | |
import { getElement } from '../../testing'; | |
@Component({ | |
template: ` | |
<div *appShowContacts="true"> | |
<p>This is shown</p> | |
</div> |
- Streams vs Observables
- Error handling in subscribe
- Create observable that handles fetch request
- Noop
- Map
- Example of reactive design: beginner courses and advanced courses with individual observables based on 1 http observable and 1 courses observable filtering out the payload of the fetch request => too many http requests
- tap()
- shareReplay()
- concat()
- filter()
OlderNewer