Angular AOT: ERROR in ng component html file : Expected 0 arguments, but got 1

Question

Initially i was getting following error while publishing angular .net core SPA App:

Can't resolve rxjs/operators in release\directives

Which i have resolved by updating the rxjs version to 5.6.

Now while publishing the app i am getting following errors:

 WARNING in EnvironmentPlugin - NODE_ENV environment variable is undefined.

You can pass an object with default values to suppress this warning.
See https://webpack.js.org/plugins/environment-plugin for example.

ERROR in ng:///D:/ClientApp/app/components/search/search.component.html (15,91): Expected 0 arguments, but got 1.

ERROR in ng:///D:/ClientApp/app/components/search/search.component.html (134,32): Expected 0 arguments, but got 1.

ERROR in ng:///D:/ClientApp/app/components/search/search.component.html (278,25): Expected 1 arguments, but got 0.

ERROR in ng:///D:/ClientApp/app/components/search/search.component.html (15,91): Expected 0 arguments, but got 1.

ERROR in ng:///D:/ClientApp/app/components/search/search.component.html (134,32): Expected 0 arguments, but got 1.

ERROR in ng:///D:/ClientApp/app/components/search/search.component.html (278,25): Expected 1 arguments, but got 0.

Search.Component.html file :

<div class="search">
<div class='panel panel-primary'>
    <div class='panel-heading resultbar'>
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <span class=' navbar-toggle collapsed glyphicon glyphicon-menu-hamburger' (window:resize)="onZoomIn($event)" (click)="toggleHeader()" style="cursor: pointer;" placement="top"></span>
        **</div>**

Not able to understand the issue

Answer 1

I found why this error was caused, this is my former @HostListener within my class:

@HostListener("window:resize", ["$event.target"])
onResize() {
    this.getElWidth();
}

As Prasant Jaya said the error is thrown because I forgot to put a param in onResize(). Now this is my new code slightly modified and working fine:

@HostListener("window:resize", ["$event.target"])
onResize(event) {
    this.getElWidth();
}

It may be better for you to use @HostListener in your class than listening to window resizing directly in the template if you want to resolve this error.

Answer 2

This error happens when you call a function from view in component without or with less parameters. The component function call should have same number of parameters as you declared in the function.

If you are still getting the same error then try adding any to the parameter, it accepts any type of value.

onZoomIn(event : any){
  console.log(event);
}

Answer 3

I got this error and effectively, I had a function in my component expecting to receive one parameter, and I called without any in my template :facepalm: