angular

Angular: Prevent route change if any changes made in the view

by

You can implement canDeactivate using typescript like import { Injectable } from ‘@angular/core’; import { CanDeactivate } from ‘@angular/router’; import { ViewthatyouwantGuard } from ‘./path to your view’; @Injectable() export class ConfirmDeactivateGuard implements CanDeactivate<ViewthatyouwantGuard> { canDeactivate(target: ViewthatyouwantGuard) { if (target.hasChanges) { return window.confirm(‘Do you really want to cancel?’); } return true; } } // hasChanges … Read more

Angular 2 Check if query parameter exists in the url

by

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

Angular 2 Component listen to change in service

by

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

Angular 2 get element height

by

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.

Failed: Unexpected directive ‘ContactDetailsComponent’ imported by the module ‘DynamicTestModule’. Please add a @NgModule annotation

by

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

Typescript target warnings after Angular 15 update

by

To understand this warning, we first need to understand how the Angular build works. First, the TypeScript build needs to run. During this step, with the settings in the tsconfig.json, your TypeScript code is being compiled into JavaScript. If you set target to ES6, prior to Angular 15 the TypeScript build would produce ES6 code. … Read more

Angular Material Dialog return value

by

If anybody is interested I found a solution (not sure if it is the best one). Just disabling the default close operation so the popup does not close on backround click, while closing it with data param on background click. matDialogRef.disableClose = true;//disable default close operation matDialogRef.backdropClick().subscribe(result => { matDialogRef.close(dataToReturn); }); This way the calling … Read more

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)