| - |
diff --git a/components/tree-select/nz-tree-select.component.html b/components/tree-select/nz-tree-select.component.html
index bfbec465747..959e0db9120 100644
--- a/components/tree-select/nz-tree-select.component.html
+++ b/components/tree-select/nz-tree-select.component.html
@@ -53,9 +53,9 @@
- {{ selectedNodes[0].title }}
+ {{ nzDisplayWith(selectedNodes[0]) }}
- {{ node.title }}
+ {{ nzDisplayWith(node) }}
diff --git a/components/tree-select/nz-tree-select.component.ts b/components/tree-select/nz-tree-select.component.ts
index caf3190dcc3..1cc6b3d8048 100644
--- a/components/tree-select/nz-tree-select.component.ts
+++ b/components/tree-select/nz-tree-select.component.ts
@@ -38,6 +38,7 @@ import { filter, tap } from 'rxjs/operators';
import { selectDropDownAnimation } from '../core/animation/select-dropdown-animations';
import { selectTagAnimation } from '../core/animation/select-tag-animations';
+import { InputBoolean } from '../core/util/convert';
import { NzFormatEmitEvent } from '../tree/interface';
import { NzTreeNode } from '../tree/nz-tree-node';
import { NzTreeComponent } from '../tree/nz-tree.component';
@@ -82,7 +83,7 @@ export class NzTreeSelectComponent implements ControlValueAccessor, OnInit, Afte
inputValue = '';
dropDownClassMap: { [ className: string ]: boolean };
dropDownPosition: 'top' | 'center' | 'bottom' = 'bottom';
- overlayRef: OverlayRef | null;
+ overlayRef: OverlayRef;
portal: TemplatePortal<{}>;
positionStrategy: FlexibleConnectedPositionStrategy;
overlayBackdropClickSubscription: Subscription;
@@ -91,28 +92,26 @@ export class NzTreeSelectComponent implements ControlValueAccessor, OnInit, Afte
selectedNodes: NzTreeNode[] = [];
value: string[] = [];
+ @Input() @InputBoolean() nzAllowClear = true;
+ @Input() @InputBoolean() nzShowExpand = true;
+ @Input() @InputBoolean() nzDropdownMatchSelectWidth = true;
+ @Input() @InputBoolean() nzCheckable = false;
+ @Input() @InputBoolean() nzShowSearch = false;
+ @Input() @InputBoolean() nzDisabled = false;
+ @Input() @InputBoolean() nzShowLine = false;
+ @Input() @InputBoolean() nzAsyncData = false;
+ @Input() @InputBoolean() nzMultiple = false;
+ @Input() @InputBoolean() nzDefaultExpandAll = false;
@Input() nzOpen = false;
- @Input() nzAllowClear = true;
@Input() nzSize = 'default';
- @Input() nzDropdownMatchSelectWidth = true;
@Input() nzPlaceHolder = '';
- @Input() nzShowSearch = true;
- @Input() nzDisabled = false;
@Input() nzDropdownStyle: { [ key: string ]: string; };
-
- @Input() nzCheckable = false;
- @Input() nzShowExpand = true;
- @Input() nzShowLine = false;
- @Input() nzAsyncData = false;
- @Input() nzMultiple = false;
- @Input() nzDefaultExpandAll = false;
@Input() nzDefaultExpandedKeys: string[] = [];
@Input() nzNodes: NzTreeNode[] = [];
-
+ @Input() nzDisplayWith: (node: NzTreeNode) => string = (node: NzTreeNode) => node.title;
@Output() nzOpenChange = new EventEmitter();
@Output() nzCleared = new EventEmitter();
@Output() nzRemoved = new EventEmitter();
-
@Output() nzExpandChange = new EventEmitter();
@Output() nzTreeClick = new EventEmitter();
@Output() nzTreeCheckBoxChange = new EventEmitter();