Angular HostBinding property from Base Component

Question

Can someone explain me how is my HostBinding in nested component understand that we already have "isTablet" property and just add "is-tablet" class to my host element ?

Webstorm says that we have overrided base isTablet property but my child component has TRUE in this property.

I can't find any explanations in official documentation

  export abstract class DetailBase {
       @Input() isTablet: boolean = true;
  }

  export class ChildComponent extends DetailBase {
       @HostBinding('class.is-tablet') isTablet: boolean; //why it is TRUE ?
  }

Krzysztof Grzybek · Accepted Answer · 2018-09-27 18:24:30Z

1

It's Typescript-specific behaviour. If member of the class has not defined value at all, transpiled javascript doesn't include this member at all. Take a look at transpiled javascript here and here:

Because extended class has defined value for member isTablet, child class has access to isTablet through prototypal inheritance.

answered Sep 27, 2018 at 18:24

Krzysztof Grzybek

9,6062 gold badges34 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular HostBinding property from Base Component

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related