小编big*_*ter的帖子

如何在Angular 4中翻译mat-paginator?

您有什么想法我如何翻译Angular mat-paginator标签中的"每页项目数" ?这mat-paginator是Material Design的一个元素.

material-design angular-material angular

34
推荐指数
4
解决办法
2万
查看次数

角度4 - 根据值改变颜色

我正在使用Angular 4,我遇到了条件样式更改的问题.我有一张桌子和价值观.我需要根据值是大于还是小于零来更改列中的值.例如 - 如果值为123,则其颜色应为绿色.如果值为-123,则其颜色应为红色.

下面是我的代码的片段,但它不像我想的那样工作:

<mat-table>
    <ng-container matColumnDef="availableBalance">
      <mat-header-cell *matHeaderCellDef>Available balance</mat-header-cell>
      <mat-cell *matCellDef="let row" *ngIf="row.availableBalance > 0" [style.color]="'red'"> {{row.availableBalance}}</mat-cell>
    </ng-container>
</mat-table>
Run Code Online (Sandbox Code Playgroud)

你有什么解决办法.先感谢您.

angular

8
推荐指数
2
解决办法
2万
查看次数

角4; paginator的"每页项目数"翻译

我在Angular 4上使用了材质设计.我在底部有一个带有分页器的表:

在此输入图像描述

有没有办法翻译Angular4中的"每页项目数"?

我有权访问这个标签

this.paginator._intl.itemsPerPageLabel
Run Code Online (Sandbox Code Playgroud)

在我的组件的.ts文件中,我放入ngOnInit()

我也有i18n fo .json文件的翻译,其结构是:

"MESSAGES_LIST_TABLE": {
      "DATE": "Date",
      "FROM": "From",
      "TO": "To",
      "MESSAGE": "Message",
      "AMOUNT": "Amount",
      "BALANCE": "Balance",
      "AVAILABLE_BALANCE": "Avail. bal",
      "ITEMS_PER_PAGE": "Items per page"
}
Run Code Online (Sandbox Code Playgroud)

我能以某种方式翻译它吗?

this.paginator._intl.itemsPerPageLabel = {{'CUSTOMER.MESSAGES_LIST_TABLE.ITEMS_PER_PAGE' | translate}}
Run Code Online (Sandbox Code Playgroud)

angular-material2 angular

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

如何在 mat-paginator (Angular 4) 中更改 itemsPerPageLabel

我正在使用 Angular 4,我需要更改分页器的值“每页项目数”。我怎样才能得到这个值?

HTML:

<mat-paginator class="mat-paginator" #paginator [length]="table_data && table_data.resultsLength" [pageSizeOptions]="[10, 25, 100]" [pageSize]="customerMessageService.rowsNumber">
</mat-paginator>
Run Code Online (Sandbox Code Playgroud)

在文档中说:

To modify the labels and text displayed, create a new instance of MatPaginatorIntl and include it in a custom provider
Run Code Online (Sandbox Code Playgroud)

我从“@angular/material”导入了 {MatPaginatorModule} 并将 MatPaginatorIntl 放在提供者中。

那么我应该在我的 .ts 文件中做什么?

将它放在我的 component.ts 中是否正确?

export class MatPaginatorIntl {
  itemsPerPageLabel = "1234";
}
Run Code Online (Sandbox Code Playgroud)

angular

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

json-server - 奇怪的自动增量 id

我的 json 服务器上的 id 自动增量有问题。我设置了一个简单的默认 json 服务器,其中包含要观看的单个 db.json 文件。

这是我的 db.json 文件(简单生成的数据):

{
  "users": [
    {
      "id": 2,
      "first_name": "Lucy",
      "last_name": "Ballmer",
      "email": "lucyb56@gmail.com"
    },
    {
      "id": 3,
      "first_name": "Anna",
      "last_name": "Smith",
      "email": "annasmith23@gmail.com"
    },
    {
      "id": 4,
      "first_name": "Robert",
      "last_name": "Brown",
      "email": "bobbrown432@yahoo.com"
    },
    {
      "id": "5",
      "first_name": "Roger",
      "last_name": "Bacon",
      "email": "rogerbacon12@yahoo.com"
    },
  ]
}
Run Code Online (Sandbox Code Playgroud)

现在我尝试使用 Postman 将一些数据发布到 db.json。我已经配置了端点:

http://localhost:4040/users
Run Code Online (Sandbox Code Playgroud)

我正在使用以下数据进行 POST:

{
  "first_name": "Marian",
  "last_name": "Gowno3333",
  "email": "gowno@gmail.com"
}
Run Code Online (Sandbox Code Playgroud)

Json-server 默认情况下会自动递增 ID,但结果我得到了奇怪的 id 格式,如下所示:

"id": "8OZrQkH"
Run Code Online (Sandbox Code Playgroud)

而不是获取例如“id”:6。 …

javascript node.js json-server

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

如何在Angular 4中切换(显示/隐藏)元素?

这是我的html元素:

<ng-container>
    <span *ngIf="row.messageText && row.messageText.length >= 30 && expanded">{{row.messageText.substr(0, 25)}}
        <span>more</span>
    </span>
</ng-container>
Run Code Online (Sandbox Code Playgroud)

当row.messageText.length大于30时,它将显示消息的一部分。row.messageText.substr()单击更多跨度后,我需要第一个跨度以显示整个消息(通过使用)。我认为通过使用(click)="toggle()"和设置一些true / false值可以找到解决方案。

你有什么想法?

angular

2
推荐指数
3
解决办法
4万
查看次数