Angular 初始化数据表加载不工作

我有数据表和数据列表。我想显示加载图标，指示数据正在加载。我可以显示数据，但不显示加载图标

我的html 我的应用程序模块类 当我尝试上面的代码时，显示下面的错误

无法绑定到“loading”，因为它不是“p-dataTable”的已知属性。 1.如果“p-dataTable”是一个角度组件，并且具有“加载”输入，则验证它是否是该模块的一部分。 2.如果“p-dataTable”是Web组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到此组件的“@NgModule.schemas”以抑制此消息

---

我错过什么了吗？请帮助我，我还没有使用angular 2。但我想你必须去一个地方
此参数为0。加载=错误

---

在回调函数内部。

在加载

属性之前，需要使用
@Input
声明符。它需要从
@angular/core
导入，首先，您不需要定时器功能，
在调用makeloading true之前，可以在angular service回调中将其设置为false

在setTimeout回调函数中，“此”是不同的对象，
有关js中的执行上下文，请参见此链接。

显示加载掩码，有不同的方法，你可以在Angular2中搜索微调器，然后你可以钩住所有http调用，你不需要再次手动写入每个http调用。
我通过将Angular2升级为angular4，将Primeng2升级为primeng4解决了这个问题

需要使用Priming-4。我们可以在每次发布后检查更改日志


您使用哪个版本的Priming？Priming4.0.0-rc.3如果可能，请共享app.moudle.ts（您保存@NgModule的地方）和p-table使用的组件ts和html代码…您能向您的模块展示您在哪里使用DataTable吗？您能发布p-DataTable组件的全部代码吗。@stackUser44从您的组件类中删除@Injectable（），声明段后面应该只有类。另外，@Injectable（）无论如何都不应该在视图组件中使用。已删除，但仍然会出现相同的错误“如果'p-dataTable'是角度组件，并且具有'loading'输入，则验证它是否是此模块的一部分。”您是否在DataTableModule中声明了StudentDataGrid？是的，声明并能够显示数据。但无法显示加载图标。相反，它显示为“未找到任何记录”。经过一段时间后，它会获取数据并显示，因为我正在获取大量数据。
 <p-dataTable [value]="stuList" [rows]="10" [paginator]="true" [loading]="loading" [totalRecords]="totalRecords" [rowsPerPageOptions]="[50,100,150]" [pageLinks]="3" sortMode="multiple" [(selection)]="selectedData"  selectionMode="single" expandableRows="true">
//coulmns
</p-dataTable>

 import {Injectable} from '@angular/core';
import {Http, Response,Headers} from '@angular/http';
import {Student} from './student';
import 'rxjs/Rx';

@Injectable()
export class StudentService {
private headers = new Headers({'Content-Type': 'application/json'});
student:Student;
url:any='http:localhost:3002/getStudents';
constructor(private http: Http) {}
//Rest Call
getData(): Observable<Student[]>{
return this.http.get(this.url)
.map(this.extractData)
.catch(this.handleError);
}
private extractData(res: Response) {
let body = res.json();
return body.data.request as Student[];
}
}

 import { Component,OnInit, Input} from '@angular/core';
import { StudentService } from './studentservice.component'
import { Student} from './student'
import { Router }    from '@angular/router';
import 'rxjs/Rx';
import 'rxjs/add/operator/map';
import {Injectable} from '@angular/core';

@Component({
selector: 'data-grid',
templateUrl: '../app/datagrid.html',
styleUrls: ['../app/datagrid.css']
})
@Injectable()
export class StudentDataGrid implements OnInit {
datasource:Student[];
stuList:Student[];
selectedData:Student; 
@Input()
loading: boolean;
totalRecords:number;
constructor(private studentService:StudentService, private router:Router) {      }
ngOnInit() {
this.loading = true;
//Rest call
this.studentService.getData().subscribe(stuList => {
this.datasource = stuList;
this.totalRecords = this.datasource.length;
this.stuList = this.datasource;
this.loading = false;
}); 
}

 import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }   from '@angular/forms';
import { HttpModule }    from '@angular/http';
import { AppRoutingModule } from './app-routing.module';
import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
import { InMemoryDataService }  from './in-memory-data.service';
import { AppComponent }         from './app.component';
import {DataTableModule,SharedModule} from 'primeng/primeng';
import {DialogModule} from 'primeng/primeng';

@NgModule({
imports: [BrowserModule,FormsModule,HttpModule,InMemoryWebApiModule.forRoot(InMemoryDataService,{passThruUnknownUrl:   true}),
AppRoutingModule,DataTableModule,SharedModule,DialogModule ],
declarations: [],providers: [],bootstrap: [ AppComponent ]})
export class AppModule { }

 import {DataTableModule,SharedModule,DialogModule} from 'primeng/primeng';
    ngOnInit() {
        this.loading = true;
        this.carService.getCarsSmall().then(cars =>{
                    this.cars = cars;
                    this.loading = false;
        });

}