无法绑定到＆＃39;已检查过＆＃39;或者＆＃39;不确定＆＃39;因为它不是“复选框”的已知属性。

Question

我在这里发帖是因为我找不到任何有用的东西。 我尝试使用角度材料创建selection data table，

表中应显示的数据来自laravel5.4应用程序。

html代码：

  

<!-- Checkbox Column -->
<ng-container matColumnDef="select">
  <mat-header-cell *matHeaderCellDef>
    <mat-checkbox (change)="$event ? masterToggle() : null"
                  [checked]="selection.hasValue() && isAllSelected()"
                  [indeterminate]="selection.hasValue() && !isAllSelected()">
    </mat-checkbox>
  </mat-header-cell>
  <mat-cell *matCellDef="let row">
    <mat-checkbox (click)="$event.stopPropagation()"
                  (change)="$event ? selection.toggle(row) : null"
                  [checked]="selection.isSelected(row)">
    </mat-checkbox>
  </mat-cell>
</ng-container>

.....  

错误详情：

Answer 1

从我的评论：请记住包括组件的模块（在这种情况下为MatCheckboxModule）

Answer 2

从@ angular / Material导入MatCheckboxModule，如下所示。在生成的material.module.ts文件中添加以下行。

import { MatCheckboxModule } from '@angular/Material'

此外，出于设计目的，我还添加了MatToolbarModule，MatCardModule，MatListModule。

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {
MatToolbarModule,
MatCardModule,
MatCheckboxModule,
MatListModule,
} from '@angular/material';

@NgModule({

exports:[
MatToolbarModule,
MatCardModule,
MatCheckboxModule,
MatListModule
],

providers: [

],
declarations: []
})
export class MaterialModule { }

并在app.module.ts文件中导入材料模块，以便我们可以在整个应用程序中使用材料模块。

import { MaterialModule } from './material/material.module';

并在@NgModule的imports数组属性中添加MaterialModule

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { MaterialModule } from './material/material.module';
import { AppComponent } from './app.component';

@NgModule({

declarations: [
AppComponent],

imports: [
BrowserModule,
MaterialModule
],

providers: [],
bootstrap: [AppComponent]
})

export class AppModule { }