After upgrading from version 4 to 5, I'm puzzled by the plethora of TypeScript TS2322 errors I'm encountering. The migration involved setting up a new Angular project with the Angular CLI.
Angular CLI: 1.5.5
Node: 8.9.1
OS: darwin x64
Angular: 5.0.4
The package JSON file is pretty standard. Here's a snippet:
"core-js": "^2.4.1",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
"@angular/core": "^5.0.0",
"tslint": "~5.7.0",
"typescript": "~2.4.2"
This is the component I'm currently testing:
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import {Observable} from 'rxjs/Rx';
@Component({
selector: 'app-sidebar',
templateUrl: './sidebar.component.html',
styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent implements OnInit {
show_dropdown$: Observable<boolean>;
@ViewChild('el_dropdown_button') el_dropdown_button: ElementRef;
constructor() { }
ngOnInit() {
// Setting up dropdown functionality
this.show_dropdown$ = Observable
.merge(
// When down arrow is clicked
Observable
.fromEvent(this.el_dropdown_button.nativeElement, 'click')
.scan((value) => !value, false)
.startWith(false),
// When input is clicked -> true
Observable
.fromEvent(this.el_filter_input.nativeElement, 'click')
.mapTo(true),
)
.startWith(false);
}
}
My IDE is flagging an error on this.show_dropdown$, indicating that:
error TS2322: Type 'Observable' is not assignable to type 'Observable'. Type 'boolean | {}' is not assignable to type 'boolean'. Type '{}' is not assignable to type 'boolean'.
Any insights or recommendations regarding TypeScript versions 2.4.2 or 2.6?