update >=RC.5 You have to import a module in whatever module you want to use components, directives or pipes of the imported module. There is no way around it. What you can do is to create a module that exports several other modules (for instance, the BrowserModule that exports CommonModule. @NgModule({ declarations: [CoolComponent, CoolDirective, CoolPipe], … Read more
When you use [] to bind to an @Input(), it’s basically a template expression. The same way displaying {{abc}} wouldn’t display anything (unless you actually had a variable called abc). If you have a string @Input(), and you want to bind it to a constant string, you could bind it like this: [myText]=” ‘some text’ … Read more
If you just need to add an attribute in order to trigger CSS rules, you can use the below method: (this does not dynamically create/destroy a directive) <button [attr.md-raised-button]=”condition ? ” : null”></button> Applied the same to your plunker: fork Update: How condition ? ” : null works as the value: When its the empty … Read more
This is special Angular binding syntax <div [class.extra-sparkle]=”isDelightful”> This is part of the Angular compiler and you can’t build a custom binding variant following this binding style. The only supported are [class.xxx]=”…”, [style.xxx]=”…”, and [attr.xxx]=”…” ngClass is a normal Angular directive like you can build it yourself <div [ngClass]=”{‘extra-sparkle’: isDelightful}”> ngClass is more powerful. It … Read more
Angular 6.1 and later: Angular 6.1 (released on 2018-07-25) added built-in support to handle this issue, through a feature called “Router Scroll Position Restoration”. As described in the official Angular blog, you just need to enable this in the router configuration like this: RouterModule.forRoot(routes, {scrollPositionRestoration: ‘enabled’}) Furthermore, the blog states “It is expected that this … Read more
That is a feature we are asking for in angular…read this: https://github.com/angular/angular/issues/8785 A quick and dirty way to do it is to use: I have a directive named myHilite (to highlight text), I also have a component named MainComponent.ts. In MainComponent.ts I added this line of code… export class MainComponent { @HostBinding(‘attr.myHilite’) myHiliteDirective = new … Read more
I think that the object you received in your response payload isn’t an array. Perhaps the array you want to iterate is contained into an attribute. You should check the structure of the received data… You could try something like that: getusers() { this.http.get(`https://api.github.com/search/users?q=${this.input1.value}`) .map(response => response.json().items) // <—— .subscribe( data => this.users = data, … Read more
To fully understand the problem and possible solutions, we need to discuss Angular change detection — for pipes and components. Pipe Change Detection Stateless/pure Pipes By default, pipes are stateless/pure. Stateless/pure pipes simply transform input data into output data. They don’t remember anything, so they don’t have any properties – just a transform() method. Angular … Read more