Can't bind to 'pagesizeoptions' since it isn't a known property of 'mat-paginator' in angular 6 material
Answers
Answered by
0
If mat-paginator is an Angular component and it has lengthinput, then verify that it is part of this module.If mat-paginator is a Web Component then add CUSTOM_ELEMENTS_SCHEMA to the @NgModule.schemas of this component to suppress this message.
Answered by
7
Hope this will help you
I want to use MatPaginatorModule in my angular t project but i am getting error:
Can't bind to 'pageSize' since it isn't a known property of 'mat-paginator'
1. If 'mat-paginator' is an Angular component and it has 'pageSize' input, then verify that it is part of this module. ...............
html
<mat-paginator #paginator [pageSize]="10" [pageSizeOptions]="[5, 10, 20]" [showFirstLastButtons]="true"> </mat-paginator>
i have imported module in my app.module.ts
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { GlobalModule } from './global/global.module'; import { ProtectedModule} from './protetcted/protect-module.component'; import { AppRoutingModule } from './app.routing.module'; // import { MatTableModule } from '@angular/material/table'; import { MatPaginatorModule } from '@angular/material'; @NgModule({ declarations: [ AppComponent, ], imports: [ BrowserModule, GlobalModule, ProtectedModule, AppRoutingModule, // MatTableModule, MatPaginatorModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
i am using angular5
package.json
{ "name": "eci", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "node app.js", "build": "ng build --prod", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^5.2.10", "@angular/cdk": "^5.2.5", "@angular/common": "^5.2.0", "@angular/compiler": "^5.2.0", "@angular/core": "^5.2.0", "@angular/forms": "^5.2.0", "@angular/http": "^5.2.0", "@angular/material": "^5.2.5", "@angular/platform-browser": "^5.2.0", "@angular/platform-browser-dynamic": "^5.2.0", "@angular/router": "^5.2.0", "angular-font-awesome": "^3.1.2", "bootstrap": "^4.1.0", "cfenv": "^1.0.4", "core-js": "^2.4.1", "express": "^4.15.0", "font-awesome": "^4.7.0", "jquery": "^3.3.1", "rxjs": "^5.5.6", "zone.js": "^0.8.19" }, "devDependencies": { "@angular/cli": "~1.7.2", "@angular/compiler-cli": "^5.2.0", "@angular/language-service": "^5.2.0", "@types/jasmine": "~2.8.3", "@types/jasminewd2": "~2.0.2", "@types/jquery": "^3.3.1", "@types/node": "~6.0.60", "codelyzer": "^4.0.1", "jasmine-core": "~2.8.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~2.0.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "^1.2.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.2", "ts-node": "~4.1.0", "tslint": "~5.9.1", "typescript": "~2.5.3" } }
please Mark it as a brainlist answer
I want to use MatPaginatorModule in my angular t project but i am getting error:
Can't bind to 'pageSize' since it isn't a known property of 'mat-paginator'
1. If 'mat-paginator' is an Angular component and it has 'pageSize' input, then verify that it is part of this module. ...............
html
<mat-paginator #paginator [pageSize]="10" [pageSizeOptions]="[5, 10, 20]" [showFirstLastButtons]="true"> </mat-paginator>
i have imported module in my app.module.ts
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { GlobalModule } from './global/global.module'; import { ProtectedModule} from './protetcted/protect-module.component'; import { AppRoutingModule } from './app.routing.module'; // import { MatTableModule } from '@angular/material/table'; import { MatPaginatorModule } from '@angular/material'; @NgModule({ declarations: [ AppComponent, ], imports: [ BrowserModule, GlobalModule, ProtectedModule, AppRoutingModule, // MatTableModule, MatPaginatorModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
i am using angular5
package.json
{ "name": "eci", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "node app.js", "build": "ng build --prod", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^5.2.10", "@angular/cdk": "^5.2.5", "@angular/common": "^5.2.0", "@angular/compiler": "^5.2.0", "@angular/core": "^5.2.0", "@angular/forms": "^5.2.0", "@angular/http": "^5.2.0", "@angular/material": "^5.2.5", "@angular/platform-browser": "^5.2.0", "@angular/platform-browser-dynamic": "^5.2.0", "@angular/router": "^5.2.0", "angular-font-awesome": "^3.1.2", "bootstrap": "^4.1.0", "cfenv": "^1.0.4", "core-js": "^2.4.1", "express": "^4.15.0", "font-awesome": "^4.7.0", "jquery": "^3.3.1", "rxjs": "^5.5.6", "zone.js": "^0.8.19" }, "devDependencies": { "@angular/cli": "~1.7.2", "@angular/compiler-cli": "^5.2.0", "@angular/language-service": "^5.2.0", "@types/jasmine": "~2.8.3", "@types/jasminewd2": "~2.0.2", "@types/jquery": "^3.3.1", "@types/node": "~6.0.60", "codelyzer": "^4.0.1", "jasmine-core": "~2.8.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~2.0.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "^1.2.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.2", "ts-node": "~4.1.0", "tslint": "~5.9.1", "typescript": "~2.5.3" } }
please Mark it as a brainlist answer
Similar questions