Search code examples
angularhttpangular-materialpaginator

Material HTTP table example throws Property has no initializer and is not definitely assigned in the constructor in local environment

I am trying to create a table which is filled with HTTP requests therefore I started with the example provided in the documentation of angular material for an HTTP table:

https://material.angular.io/components/table/examples

https://stackblitz.com/angular/rkmqrvxvjlk?file=src%2Fapp%2Ftable-http-example.ts

When I execute it in the website it works. But when I add it to a component in my local environment I get this exceptions:

Property 'exampleDatabase' has no initializer and is not definitely assigned in the constructor.ts(2564)
Property 'filteredAndPagedIssues' has no initializer and is not definitely assigned in the constructor.ts(2564)
Property 'paginator' has no initializer and is not definitely assigned in the constructor.ts(2564)
Property 'sort' has no initializer and is not definitely assigned in the constructor.ts(2564)

I have tried workarounds of adding ? or ! after the variable but then it still won't work. I will not see the exception but it will crash on runtime with:

ERROR TypeError: this.sort is undefined.

I have not done any change to the code more than changing the name of the component. Other than that I just coppied the HTML and the css together with the .ts content and imports:

enter image description here

Solution

  • You probably forgot to include the MatSortModule.

    Don't forget it import it in your 'app.modules.ts'

    import { MatSortModule } from '@angular/material/sort';
...
@NgModule({
    declarations: [
        ...
    ],
    imports: [
        ...
        MatSortModule
    ],
    ...
})
export class AppModule { }