Angular web component (elements) input is undefined in ngOnInit

Question

I am building a web component in Angular. My objective is to evaluate if the consumer of the web component provided a given input, in this case "accessToken". However the input is undefined in ngOnInit() , but prints in ngOnChanges()

    _accessToken;
    @Input('accessToken')
    set accessToken(accessToken: string) {
        this._accessToken = accessToken;
        console.log(accessToken); // This prints the token, but after ngOnInit??
    }

    ngOnInit() {
      console.log(this._accessToken); // Why is this undefined?
    }

    ngOnChanges(changes) {
      console.log(changes); // This prints the token??
    }

Why it's not available in the ngOnInit life-cycle hook, and how do I determine if the user provided the input or not in the most efficient way?

Any ideas are welcome

Answer 1

I can't believe that this answers the question, but apparently I simply had to change my input from accessToken ==> access_token .

I find out by using the Chrome dev tools, and inspecting the component(!)

This is also explained here :

You should always use lowercase characters.

One of those days - but it works now. Also in ngOnInit()