小编Nag*_*rma的帖子

Angular MatPaginator无法正常工作

我有2个组件.两者都有mat-table和paginator,并且分页对一个组件起作用,而不是为另一个组件工作,尽管代码类似.下面是我的html:

<div class="mat-elevation-z8">

    <mat-table [dataSource]="dataSource" matSort>

      <ng-container matColumnDef="col1">
        <mat-header-cell *matHeaderCellDef mat-sort-header> Column1 </mat-header-cell>
        <mat-cell *matCellDef="let row"> {{row.col1}} </mat-cell>
      </ng-container>

      <ng-container matColumnDef="col2">
        <mat-header-cell *matHeaderCellDef mat-sort-header> Column2 </mat-header-cell>
        <mat-cell *matCellDef="let row"> {{row.col2}} </mat-cell>
      </ng-container>

      <!-- Different columns goes here -->

      <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
      <mat-row *matRowDef="let row; columns: displayedColumns;">
      </mat-row>
    </mat-table>

    <mat-paginator #scheduledOrdersPaginator [pageSizeOptions]="[5, 10, 20]"></mat-paginator>
  </div>
Run Code Online (Sandbox Code Playgroud)

以下是我在component.ts中的代码:

dataSource: MatTableDataSource<any>;
displayedColumns = ['col1', 'col2', ... ];
@ViewChild('scheduledOrdersPaginator') paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
ngOnInit(): void {
    // Load data
    this.dataSource = new MatTableDataSource(somearray);
    this.dataSource.paginator = …
Run Code Online (Sandbox Code Playgroud)

pagination angular-material angular

33
推荐指数
9
解决办法
3万
查看次数

使用jsonpath表达式的数组大小 - Stefan Goessner JsonPath

我使用Stefan Goessner的JsonPath找到数组或列表大小时遇到​​问题.我使用的是json-path-2.0.0版本.

我的jsonpath表达式是$.orders.length和JSON看起来像这样:

它失败了以下错误:

com.jayway.jsonpath.PathNotFoundException: Property ['length'] not found in path $['orders']
Run Code Online (Sandbox Code Playgroud)

而且我也尝试$.orders.length()了以下错误再次失败:

com.jayway.jsonpath.PathNotFoundException: Property ['length()'] not found in path $['orders']

请建议我如何使用Goessner的JsonPath表达式获取数组的长度.

[编辑]以下是我如何获得配置:

    com.jayway.jsonpath.Configuration conf = com.jayway.jsonpath.Configuration.defaultConfiguration().addOptions(Option.DEFAULT_PATH_LEAF_TO_NULL);
    DocumentContext documentContext = JsonPath.using(conf).parse(orderJson);
    Object val = documentContext.read(jsonPathExpression);
Run Code Online (Sandbox Code Playgroud)

java arrays size json jsonpath

18
推荐指数
1
解决办法
3万
查看次数

模块'AppModule'导入的意外值'MatSnackBar'.请添加@NgModule注释

我想利用MatSnackBar在事件完成时显示通知.我在我的app模块中导入了MatSnackBar,下面是我的app.module.ts

...
import { MatSnackBar,
    MatSnackBarConfig, ...
} from '@angular/material';
...

@NgModule({
    declarations: [...],
    imports: [MatSnackBar, MatSnackBarConfig, ...],
    providers: [...],
    bootstrap: [...],
    entryComponents: [...]
})
export class AppModule {
}
Run Code Online (Sandbox Code Playgroud)

下面是我的package.json:

{
    "@angular/animations": "^5.1.0",
    "@angular/cdk": "^5.0.0",
    "@angular/cli": "^1.6.1",
    "@angular/common": "^5.1.0",
    "@angular/compiler": "^5.1.0",
    "@angular/compiler-cli": "^5.1.0",
    "@angular/core": "^5.1.0",
    "@angular/forms": "^5.1.0",
    "@angular/http": "^5.1.0",
    "@angular/language-service": "^5.1.0",
    "@angular/material": "^5.0.0",
    "@angular/platform-browser": "^5.1.0",
    "@angular/platform-browser-dynamic": "^5.1.0",
    "@angular/router": "^5.1.0",
    "@swimlane/ngx-charts": "^7.0.1",
    "@types/jasmine": "^2.8.2",
    "@types/jasminewd2": "^2.0.3",
    "@types/node": "^8.0.56",
    "angular2-datatable": "^0.6.0",
    "core-js": "^2.5.1",
    "d3": "^4.10.0",
    "ng-http-loader": "^0.2.0",
    "ng2-charts": "^1.6.0",
    "ng2-handsontable": "^1.0.3", …
Run Code Online (Sandbox Code Playgroud)

angular-material angular

14
推荐指数
1
解决办法
8072
查看次数

哈希位置策略不起作用 - Angular 4 - NgxChartsModule打破了哈希位置策略

我正在开发一个Angular 4应用程序.我打算使用HashLocationStrategy但不起作用(#没有出现在URL中).以下是我的应用程序路由模块:

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { DashboardPage } from './dashboard-page/component';
import { AccountPage } from './acct-page/component';

const appRoutes: Routes = [
    { path: 'dashboard', component: DashboardPage },
    { path: 'accounts/:number', component: AccountPage},
    { path: '', redirectTo: '/dashboard', pathMatch: 'full' },
];

@NgModule({
    imports: [RouterModule.forRoot(appRoutes, { enableTracing: false, useHash: true })],
    exports: [RouterModule],
    providers: []
})
export class AppRoutingModule { }
Run Code Online (Sandbox Code Playgroud)

以下是我的app.module.ts:

import { BrowserModule } from '@angular/platform-browser'; …
Run Code Online (Sandbox Code Playgroud)

angular angular4-router

6
推荐指数
2
解决办法
3442
查看次数