不能绑定到“dataSource”-角度

Question

这一次我使用的是角，当我尝试做一个表时，我得到了这个错误：

错误响应:错误: Uncaught (承诺中)：错误:模板解析错误:无法绑定到'dataSource‘，因为它不是’dx-数据网格‘的已知属性。

1. 如果‘dx-数据网格’是一个角度分量，它有'dataSource‘输入，然后验证它是该模块的一部分。
2. 如果‘dx-数据网格’是一个Web组件，那么将'CUSTOM_ELEMENTS_SCHEMA‘添加到该组件的'@NgModule.schemas’中，以抑制此消息。
3. 若要允许任何属性，请将“NO_ERRORS_SCHEMA”添加到此组件的“@NgModule.schemas”中。

("AddressType“class=表m-b-0切换箭头-微小的彩色表信息表”错误->[dataSource]="dtAddressType"> </dx-data-grid> ")

我的AdressType.component.html和AdressType.component.ts

​

import { Component, OnInit, ViewContainerRef, NgModule } from '@angular/core';
import { AdressType } from '../models/adresstype';
import { AddressTypeService } from '../adresstype.service';

@Component({
  selector: '...',
  templateUrl: '...',
  styleUrls: ['...']
})

export class ListAddressTypeComponent implements OnInit {
  public addressTypes: AddressType[];
  
  constructor(
    public addressTypeService: AddressTypeService) {
    ... // Other things
  }

  ngOnInit(): void {
    this.addressTypeService.GetAdressTypes()
    .subscribe(addressTypes => {
      this.addressTypes = addressTypes
      this.data = addressTypes
    },
      () => this.errors);
  }
  
  ... // Other things
}

<div class="row">
    <div class="card col-12">
        <div class="card">
            <div class="card-block" style="display: inline;">
                <br />
                <div class="table-responsive">
                    <dx-data-grid #grid id="tableAddressType" class="table m-b-0 toggle-arrow-tiny color-table info-table"
                        [dataSource]="dtAddressType">
                        
                    </dx-data-grid>
                </div>
            </div>
        </div>
    </div>
</div>

​

还有我的app.component.ts

​

import { DxDataGridModule } from 'devextreme-angular';
import { BrowserModule } from '@angular/platform-browser';
import { Component,NgModule } from '@angular/core';
import config from "devextreme/core/config";
import { loadMessages, locale } from "devextreme/localization";
import 'devextreme-intl';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
@NgModule({
  imports: [
      BrowserModule,
      DxDataGridModule
  ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppComponent {
  title = 'app';
  locale: string;
  constructor() {
    config({ defaultCurrency: "BRL" });
  }
}

​

我看到这个链接https://js.devexpress.com/Demos/WidgetsGallery/Demo/DataGrid/SimpleArray/Angular/Light/

Answer 1

请参阅此处app.component.ts

对于自定义数据源，需要在component.ts https://js.devexpress.com/Demos/WidgetsGallery/Demo/DataGrid/CustomDataSource/Angular/Light/中公开

export class AppComponent { dataSource: any = {}; ....，那么您可能需要与[]像[dataSource]="dataSource一样使用它。