0

angular2 智能表未显示该表。我已经按照链接git hub

app.module.ts

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent }  from './app.component';
import { Ng2SmartTableModule } from 'ng2-smart-table';
@NgModule({
    imports: [BrowserModule, FormsModule, Ng2SmartTableModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]

})
export class AppModule { }

request.component.ts

import { Component } from '@angular/core';
import { ItableValues } from './tableValues.component';
import { RequestFilterPipe } from './request-filter.pipe';
import { TableService } from './table-service.component';
@Component({
    selector: 'mm-request',
    templateUrl: 'app/dataManagement/request.component.html',
 
})

export class RequestComponent  {
    pageTitle: string = 'Request';
    imageWidth: number = 50;
    imageMargin: number = 2;
   
    settings = {
        columns: {
            id: {
                title: 'ID'
            },
            name: {
                title: 'Full Name'
            },
            username: {
                title: 'User Name'
            },
            email: {
                title: 'Email'
            }
        }
    };
    data = [
        {
            id: 1,
            name: "Leanne Graham",
            username: "Bret",
            email: "Sincere@april.biz"
        },
        {
            id: 2,
            name: "Ervin Howell",
            username: "Antonette",
            email: "Shanna@melissa.tv"
        },

        // ... list of items

        {
            id: 11,
            name: "Nicholas DuBuque",
            username: "Nicholas.Stanton",
            email: "Rey.Padberg@rosamond.biz"
        }
    ];

}

request.component.html

<div>
    <ng2-smart-table [settings]="settings" [source]="data"></ng2-smart-table>
</div>

每当我运行应用程序时,它只显示第一个加载页面。 在此处输入图像描述 所有帮助将不胜感激。

更新:我已经删除了声明和引导程序中使用的 Ng2SmartTableModule 它用于测试。请查看控制台日志和错误 main.js 文件。 在此处输入图像描述

加载http://localhost:53869/app/main.js 时出错

"use strict";
var app_module_1 = require('./app.module');
var platform_browser_dynamic_1 = require('@angular/platform-browser-dynamic');
platform_browser_dynamic_1.platformBrowserDynamic().bootstrapModule(app_module_1.AppModule);
//# sourceMappingURL=main.js.map

4

1 回答 1

0

打开您的控制台,然后先阅读您的错误日志。

bootstrap数组和declarations数组不应该包括这个Ng2SmartTableModule

请先阅读以下内容:

NgModule是一个装饰器函数,它接受一个元数据对象,其属性描述了模块。最重要的属性是:

declarations- 属于该模块的视图类。Angular 有三种视图类:componentsdirectivespipes

exports- 应该在其他模块的组件模板中可见和可用的声明子集。

imports- 此模块中声明的组件模板需要其导出类的其他模块。

providers- 该模块为全球服务集合做出贡献的服务创建者;它们在应用程序的所有部分都可以访问。

bootstrap- 主应用程序视图,称为根组件,托管所有其他应用程序视图。只有根模块应该设置这个引导属性。

https://angular.io/guide/architecture

于 2017-06-19T13:28:12.300 回答