Skip to content

Commit fbd4df0

Browse files
committed
update docs
1 parent f822645 commit fbd4df0

File tree

1 file changed

+15
-4
lines changed

1 file changed

+15
-4
lines changed

docs/framework/angular/angular-table.md

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -85,23 +85,29 @@ class YourComponent {}
8585
#### Rendering a Component
8686

8787
To render a Component into a specific column header/cell/footer, you can pass a `FlexRenderComponent` instantiated with
88-
your `ComponentType, with the ability to include parameters such as inputs and an injector.
88+
your `ComponentType, with the ability to include parameters such as inputs, outputs and a custom injector.
8989

9090
```ts
9191
import {flexRenderComponent} from "./flex-render-component";
9292
import {ChangeDetectionStrategy} from "@angular/core";
93+
import {output} from "nx/src/utils/output";
9394

9495
@Component({
9596
template: `
9697
...
9798
`,
9899
standalone: true,
99-
changeDetectionStrategy: ChangeDetectionStrategy.OnPush
100+
changeDetectionStrategy: ChangeDetectionStrategy.OnPush,
101+
host: {
102+
'(click)': 'clickEvent.emit($event)'
103+
}
100104
})
101105
class CustomCell {
102106
readonly content = input.required<string>();
107+
readonly cellType = input<MyType>();
103108

104-
readonly type = input<MyType>()
109+
// An output that will emit for every cell click
110+
readonly clickEvent = output<Event>();
105111
}
106112

107113
class AppComponent {
@@ -120,7 +126,12 @@ class AppComponent {
120126
inputs: {
121127
// Mandatory input since we are using `input.required()
122128
content: context.row.original.rowProperty,
123-
type // Optional input
129+
// cellType? - Optional input
130+
},
131+
outputs: {
132+
clickEvent: () => {
133+
// Do something
134+
}
124135
}
125136
}
126137
)

0 commit comments

Comments
 (0)