Angular – “has no exported member ‘Observable'”

This might be helpful in Angular 6 for more info refer this Document rxjs: Creation methods, types, schedulers and utilities import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from ‘rxjs’; rxjs/operators: All pipeable operators: import { map, filter, scan } from ‘rxjs/operators’; rxjs/webSocket: The web socket subject implementation import { webSocket … Read more

Set focus on element

Edit 2022: Read a more modern way with @Cichy’s answer below Modify the show search method like this showSearch(){ this.show = !this.show; setTimeout(()=>{ // this will make the execution after the above boolean has changed this.searchElement.nativeElement.focus(); },0); }

Using Pipes within ngModel on INPUT Elements in Angular

You can’t use Template expression operators(pipe, save navigator) within template statement: (ngModelChange)=”Template statements” (ngModelChange)=”item.value | useMyPipeToFormatThatValue=$event” https://angular.io/guide/template-syntax#template-statements Like template expressions, template statements use a language that looks like JavaScript. The template statement parser differs from the template expression parser and specifically supports both basic assignment (=) and chaining expressions (with ; or ,). However, certain … Read more

How can I limit ngFor repeat to some number of items in Angular?

This seems simpler to me <li *ngFor=”let item of list | slice:0:10; let i=index” class=”dropdown-item” (click)=”onClick(item)”>{{item.text}}</li> Closer to your approach <ng-container *ngFor=”let item of list; i as index”> <li class=”dropdown-item” (click)=”onClick(item)” *ngIf=”i<11″>{{item.text}}</li> </ng-container> alternative <ng-template ngFor let-item [ngForOf]=”list” let-i=”index”> <li class=”dropdown-item” (click)=”onClick(item)” *ngIf=”i<11″>{{item.text}}</li> </ng-template>

How to emit an event from parent to child?

Using RxJs, you can declare a Subject in your parent component and pass it as Observable to child component, child component just need to subscribe to this Observable. Parent-Component eventsSubject: Subject<void> = new Subject<void>(); emitEventToChild() { this.eventsSubject.next(); } Parent-HTML <child [events]=”eventsSubject.asObservable()”> </child> Child-Component private eventsSubscription: Subscription; @Input() events: Observable<void>; ngOnInit(){ this.eventsSubscription = this.events.subscribe(() => doSomething()); … Read more

vs

Edit : Now it is documented <ng-container> to the rescue The Angular <ng-container> is a grouping element that doesn’t interfere with styles or layout because Angular doesn’t put it in the DOM. (…) The <ng-container> is a syntax element recognized by the Angular parser. It’s not a directive, component, class, or interface. It’s more like the curly braces in a … Read more

How to get the Angular version?

ng version You installed angular cli globally (-g in the command). This means that you can type ng version into your command prompt. It may be more precise to do this when your command prompt is not within a npm controlled directory (you should type this in within directory you typed ng new myapp). A … Read more

Angular HttpClient “Http failure during parsing”

You can specify that the data to be returned is not JSON using responseType. In your example, you can use a responseType string value of text: return this.http.post( ‘http://10.0.1.19/login’, {email, password}, {responseType: ‘text’}) The full list of options for responseType is: json (the default) text arraybuffer blob See the docs for more information.