SlicePipe

pipe 非纯管道

从一个 Array 或 String 中创建其元素一个新子集（slice）。

Creates a new Array or String containing a subset (slice) of the elements.

      
      {{ value_expression | slice : start [ : end ] }}

NgModule

CommonModule
```
      
      CommonModule
    
```

输入值

value any

参数

`start`	`number`
`end`	`number`	可选. 默认值是 `undefined`.

使用说明

所有行为都基于 JavaScript API Array.prototype.slice() 和 String.prototype.slice() 的预期行为。

All behavior is based on the expected behavior of the JavaScript API Array.prototype.slice() and String.prototype.slice().

当操作 Array 时，返回的 Array 始终是一个副本 —— 即使返回了所有元素也是一样。

When operating on an Array, the returned Array is always a copy even when all the elements are being returned.

当操作空白值时，该管道也会返回空白值。

When operating on a blank value, the pipe returns the blank value.

列表范例

List Example

ngFor 例子：

This ngFor example:

      
      @Component({
  selector: 'slice-list-pipe',
  template: `<ul>
    <li *ngFor="let i of collection | slice:1:3">{{i}}</li>
  </ul>`
})
export class SlicePipeListComponent {
  collection: string[] = ['a', 'b', 'c', 'd'];
}

生成下列内容：

produces the following:

      
      <li>b</li>
<li>c</li>

字符串范例

String Examples

      
      @Component({
  selector: 'slice-string-pipe',
  template: `<div>
    <p>{{str}}[0:4]: '{{str | slice:0:4}}' - output is expected to be 'abcd'</p>
    <p>{{str}}[4:0]: '{{str | slice:4:0}}' - output is expected to be ''</p>
    <p>{{str}}[-4]: '{{str | slice:-4}}' - output is expected to be 'ghij'</p>
    <p>{{str}}[-4:-2]: '{{str | slice:-4:-2}}' - output is expected to be 'gh'</p>
    <p>{{str}}[-100]: '{{str | slice:-100}}' - output is expected to be 'abcdefghij'</p>
    <p>{{str}}[100]: '{{str | slice:100}}' - output is expected to be ''</p>
  </div>`
})
export class SlicePipeStringComponent {
  str: string = 'abcdefghij';
}

NgModulelink

输入值link

参数link

使用说明link

列表范例link

List Examplelink

字符串范例link

String Exampleslink