### File

`src/structured-list/list-column.component.ts`

### Description

`ListColumn` represents a single column in a `StructuredList`.

`ListColumn`s can be used in a `ListHeader` to specify the column headers, or in `ListRow`s to specify the column data.

Example:

     * <ibm-list-column nowrap="true">Column 1</ibm-list-column>
     *

### Metadata

selector | `ibm-list-column`
template |
    <span *ngIf="skeleton"></span>
    <ng-content></ng-content>

### Index

###### Inputs
nowrap skeleton
###### HostBindings
class.bx--structured-list-td class.bx--structured-list-th

### Inputs

`nowrap` | Applies `white-space: nowrap` to the content of this `ListColumn` Default value : `false`
Defined in src/structured-list/list-column.component.ts:28

`skeleton` | Default value : `false`
Defined in src/structured-list/list-column.component.ts:21

### HostBindings

class.bx--structured-list-td
`class.bx--structured-list-td: ```
Default value : `true`
Defined in src/structured-list/list-column.component.ts:24

class.bx--structured-list-th
`class.bx--structured-list-th: ```
Default value : `true`
Defined in src/structured-list/list-column.component.ts:23

    import { Component, HostBinding, Input } from "@angular/core";

    /**
     * `ListColumn` represents a single column in a `StructuredList`.
     *
     * `ListColumn`s can be used in a `ListHeader` to specify the column headers, or in `ListRow`s to specify the column data.
     *
     * Example:
     * ```html
     * <ibm-list-column nowrap="true">Column 1</ibm-list-column>
     * ```
     */
    @Component({
    	selector: "ibm-list-column",
    	template: `
    		<span *ngIf="skeleton"></span>
    		<ng-content></ng-content>
    	`
    })
    export class ListColumn {
    	@Input() skeleton = false;

    	@HostBinding("class.bx--structured-list-th") isHeaderColumn = true;
    	@HostBinding("class.bx--structured-list-td") isBodyColumn = true;
    	/**
    	 * Applies `white-space: nowrap` to the content of this `ListColumn`
    	 */
    	@HostBinding("class.bx--structured-list-content--nowrap") @Input() nowrap = false;
    }

Legend
Html element
Component
Html element with directive

# result-matching ""

# No results matching ""