Questions tagged [angular2-hostbinding]
56 questions
2
votes
1 answer
Why @HostBinding is triggered continuously even though the variable didn't changed? (Angular)
I joined a new Angular project and on the app.component.ts are some @HostBindings that are called non-stop even though there is no direct event that is triggered.
Ex.:
settings = {
layout: { isCollapsed: false…

Andrei Cristian
- 81
- 1
- 5
2
votes
1 answer
HostBinding not binding to CSS variable
I am trying to bind a variable in my angular component to a variable inside a CSS keyframe that I am using to animate a div dynamically. I came across HostBinding as a potential solution however I (think) I followed the declaration correctly but the…

MF Boom
- 23
- 3
2
votes
0 answers
Angular 6: Host binding in directive is not two way binding?
I am working on Angular 6 on a pretty simple example.
I am creating a Directive that I can put on my textareas so that they resize themselves automatically.
However, I have an issue using host binding. I want to check if resize is needed before…

Max
- 21
- 2
2
votes
3 answers
Angular 6 HostBinding with multiple values?
I have successfully used @HostBinding in my Angular 6 app to apply properties to the host component, as in applying a class when a variable is true:
@HostBinding('class.compact-ui') isCompact;
Now, however, I need to assign one of 4 possible classes…

Steve
- 14,401
- 35
- 125
- 230
2
votes
2 answers
Angular HostBinding (get with parameter?)
I have a component with a numeric input. And based on that input value, I want to set a width to the component. I need to do it via class, because the width is calculated through sass variables and it is possible that it will be changed.
So I have…

Laker
- 1,622
- 4
- 20
- 32
2
votes
1 answer
How can I add an unknown class with HostBinding?
I want to use HostBinding decorator in order to add a class, which cannot be hardcoded like @HostBinding('class.myClass').
I know there is a possibility to bind it to the whole class attribute like @HostBinding('class'), but that will obviously…

Clem
- 11,334
- 8
- 34
- 48
2
votes
0 answers
Using HostBinding, HostListener rather than :host
I'm building a service and I need to remove the host property. I know this isn't going to break my application, but how would I go about doing this.
I currently have
@Directive({
selector: '[phoneMask]',
host: {
…

Rafael
- 3,593
- 3
- 17
- 27
2
votes
1 answer
Using Angular @HostBinding inside directive to set and update attribute values on host
So, let's say I have the following directive:
import { Directive, HostBinding } from '@angular/core';
@Directive({
selector: '[foo]'
});
export class FooDirective {
x: number;
constructor() {
this.x = 100;
…

katyusha
- 151
- 1
- 11
2
votes
1 answer
Angular 2 : @HostBinding with an Input object property
Is it possible to bind a @HostBinding value like this example ?
@Input() user: User;
@HostBinding("class.temp") user.role == "Admin"
I know I can do this :
private _user: User;
@Input() set user(user: User) {
this._user = user;
this.temp =…

Mattew Eon
- 1,722
- 1
- 21
- 38
1
vote
0 answers
Why is my *ngFor list being reloaded when @HostListener event fires
I have a custom directive using a HostListener to detect when the mouse enters a list element, and using HostBinding to change the background color of the element.
@HostBinding('style.backgroundColor') backgroundColor: string;
…

njran
- 11
- 2
1
vote
0 answers
Angular: ChangeDetection Interferes with HostBinding
I'm trying to implement an Animate On Scroll library/helper based on this idea Wizdm Genesys
I have a service that emits an IntersectionInfo (IsIntersecting, Direction, IsEntering, etc. ) object when an element intersects with the viewport.
I…

ShanieMoonlight
- 1,623
- 3
- 17
- 28
1
vote
1 answer
Set an HTML class to host in an Angular directive
How would you do to add and set an HTML class that can be changed with a parameter, with an Angular directive ?
Let's say we have a div with an already existing class, but no directive :
Now, we want to attach a…

Nigel
- 23
- 5
1
vote
1 answer
HostBinding a FormControl to a input within a Directive
I am having trouble adding a formControl to a input via a HostBinding inside a directive attached to the Input.
Please let me know if this is a possible approach and if so how to do it.
Input
The Directive…

Sachith Rukshan
- 340
- 6
- 24
1
vote
1 answer
@HostBinding initial @Input value ignored
I have a directive that helps with adding toggle effects to various elements.
export class AlloyToggleDirective {
private toggled = false;
@Input('alloyToggled')
@HostBinding('class.alloy-toggled')
get isToggled() { return…

Anthony
- 7,638
- 3
- 38
- 71
1
vote
2 answers
Angular 6 what is the difference between @HostBinding('class') and @HostBinding('attr.class')
I'm inspecting the source code of an Angular 6 project and saw the usage of both @HostBinding('class') and @HostBinding('attr.class'). I changed one of the implementations from @HostBinding('class') to @HostBinding('attr.class') and did not notice…

KlavierCat
- 168
- 2
- 14