Best possible solution I could come up with till now. You would have to install the below packages from npm html2canvas jspdf import * as jsPDF from ‘jspdf’; import html2canvas from ‘html2canvas’; htmltoPDF() { // parentdiv is the html element which has to be converted to PDF html2canvas(document.querySelector(“#parentdiv”)).then(canvas => { var pdf = new jsPDF(‘p’, … Read more
Angular does not need Node.js directly and it is not mandatory to use Node.js. But you will need Node.js for all the build and development tools. For an example these are few reasons that you need Node.js for building an Angular app, npm (node package manager) comes with Node.js by default and it allows you … Read more
The subscribe() call returns a Subscription and this is what you use to unsubscribe: class JobToolbarComponent private subscr:Subscription; ngOnInit() { … this.subscr = this.form.valueChanges … … } ngOnDestroy() { this.subscr.unsubscribe(); } }
I would say using: ngOnInit() { if (this.route.snapshot.queryParams[‘id’]) { //do your stuff. example: console.log(‘id: ‘, this.route.snapshot.queryParams[‘id’]); } } would be sufficient. Don’t forget to initialize private route: ActivatedRoute in constructor and import { ActivatedRoute } from ‘@angular/router’; Since you only need to check if it exists or not. If it does your stuff would occur, … Read more
Create a sidebar component with an <ng-content> where the passed children should be displayed @Component({ selector: ‘sidebar’, template: ‘<ul><ng-content></ng-content></ul>’ }) export class SidebarComponent { } and use it like <sidebar> <li class=”tooltipped” data-position=”right” data-delay=”50″ data-tooltip=”Go to the dashboard”> <a href=”#”> <i class=”material-icons”>home</i> <span>Home</span> </a> </li> <li class=”tooltipped” data-position=”right” data-delay=”50″ data-tooltip=”Manage your times”> <a href=”#”> <i … Read more
Depending on how that boolean changes you could expose it as an Observable<boolean> on your service, and then subscribe to that stream in your component. Your service would look something like: @Injectable() export class MyBooleanService { myBool$: Observable<boolean>; private boolSubject: Subject<boolean>; constructor() { this.boolSubject = new Subject<boolean>(); this.myBool$ = this.boolSubject.asObservable(); } …some code that emits … Read more
The ViewChild decorated variable elementView is only set after the ngAfterViewInit life cycle hook: import {Component, ElementRef, ViewChild, AfterViewInit} from ‘@angular/core’; @Component({ selector: ‘my-app’, templateUrl: ‘./src/app.html’ }) export class AppComponent implements AfterViewInit { @ViewChild(‘content’) elementView: ElementRef; contentHeight: number; constructor() { } ngAfterViewInit() { this.contentHeight = this.elementView.nativeElement.offsetHeight; } } See https://angular.io/api/core/ViewChild#how-to-use for more info.
You can’t have the size of an element before the page is loaded. In case it’s not clear enough, if the page isn’t loaded, then your HTML element isn’t loaded. If you want to set the viewbox of your SVG according to a div, you will need to wait for the page to load, then … Read more
Use iif rxjs. iif accepts a condition function and two Observables. When an Observable returned by the operator is subscribed, condition function will be called. https://www.learnrxjs.io/operators/conditional/iif
Remove ContactDetailsComponent component from the import array and add it in the declaration array. Components are always placed in a declaration array and modules are placed in import array. Here is the solution: import { async, ComponentFixture, TestBed } from ‘@angular/core/testing’; import { AdditionalContactDetailsComponent } from ‘./additional-contact-details.component’; import { EdlInputModule, EdlIconModule, EdlMessagesModule } from ‘@fedex/ddt’; … Read more