These are the 5 steps I perform when I get such an error. Are you sure the name is correct? (Also check the selector defined in the component) Declare the component in a module? If it is in another module, export the component? If it is in another module, import that module? Restart the cli? … Read more
npm start will run whatever you have defined for the start command of the scripts object in your package.json file. So if it looks like this: “scripts”: { “start”: “ng serve” } Then npm start will run ng serve.
I fixed this error by adding the name=”fieldName” ngDefaultControl attributes to the element that carries the [(ngModel)] attribute.
Solution 1: Copy any text HTML <button (click)=”copyMessage(‘This goes to Clipboard’)” value=”click to copy” >Copy this</button> .ts file copyMessage(val: string){ const selBox = document.createElement(‘textarea’); selBox.style.position = ‘fixed’; selBox.style.left=”0″; selBox.style.top = ‘0’; selBox.style.opacity = ‘0’; selBox.value = val; document.body.appendChild(selBox); selBox.focus(); selBox.select(); document.execCommand(‘copy’); document.body.removeChild(selBox); } Solution 2: Copy from a TextBox HTML <input type=”text” value=”User input Text … Read more
update 2 ::slotted ::slotted is now supported by all new browsers and can be used with ViewEncapsulation.ShadowDom https://developer.mozilla.org/en-US/docs/Web/CSS/::slotted update 1 ::ng-deep /deep/ was deprecated and replaced by ::ng-deep. ::ng-deep is also already marked deprecated, but there is no replacement available yet. When ViewEncapsulation.Native is properly supported by all browsers and supports styling accross shadow DOM … Read more
I don’t know if the ChangeDetectorRef was required when the question was created, but now this is enough: import { MatTableDataSource } from ‘@angular/material/table’; // … dataSource = new MatTableDataSource<MyDataType>(); refresh() { this.myService.doSomething().subscribe((data: MyDataType[]) => { this.dataSource.data = data; } } Example: StackBlitz
All details can be found here: https://angular.io/docs/ts/latest/guide/template-syntax.html directiveName – is the short hand form for structural directives where the long form can only be applied to <template> tags. The short form implicitely wraps the element where it’s applied in a <template>. [prop]=”value” is for object binding to properties (@Input() of an Angular component or directive … Read more
Actually I have imports messed up. In latest version of RxJS we can import it like that: import ‘rxjs/add/observable/of’;
You can navigate to the current route with new query params, which will not reload your page, but will update query params. Something like (in the component): import {ActivatedRoute, Router} from ‘@angular/router’; constructor( private router: Router, private activatedRoute: ActivatedRoute, ) { } public myMethodChangingQueryParams() { const queryParams: Params = { myParam: ‘myNewValue’ }; this.router.navigate( [], … Read more
Operators first() and take(1) aren’t the same. The first() operator takes an optional predicate function and emits an error notification when no value matched when the source completed. For example this will emit an error: import { EMPTY, range } from ‘rxjs’; import { first, take } from ‘rxjs/operators’; EMPTY.pipe( first(), ).subscribe(console.log, err => console.log(‘Error’, … Read more