NG-ZORRO列表怎么设置被选中效果

感谢您的提问。对于NG-ZORRO列表组件，您可以使用nz-select控件和nz-option控件来设置被选中的效果。具体做法如下：

1. 在使用nz-select控件时，设置nzMode属性为'multiple'或'tags'以支持多选或输入框选项；
2. 在使用nz-option控件时，设置nzSelected属性值为true来表示该选项被选中；
3. 在样式文件中，添加选中效果的CSS样式，例如设置背景色等。

希望这些信息对您有所帮助。如有其他问题，请随时提问。

相关问题

NG-ZORRO的nz-list-item标签怎么设置点击被选中效果

nz-list-item标签是NG-ZORRO的一个组件，用于展示列表项。如果想要设置点击被选中的效果，可以使用nzSelected属性，将其值设置为该列表项的唯一标识符。例如：

<nz-list>
  <nz-list-item nzTitle="Item 1" [nzSelected]="selectedItem === 'item1'" (click)="selectItem('item1')"></nz-list-item>
  <nz-list-item nzTitle="Item 2" [nzSelected]="selectedItem === 'item2'" (click)="selectItem('item2')"></nz-list-item>
  <nz-list-item nzTitle="Item 3" [nzSelected]="selectedItem === 'item3'" (click)="selectItem('item3')"></nz-list-item>
</nz-list>

在组件的ts文件中，需要定义一个selectedItem变量表示当前选中的列表项，以及一个selectItem方法用于更新该变量：

selectedItem: string;

selectItem(item: string) {
  this.selectedItem = item;
}

这样就可以实现点击被选中的效果了。

nzselect 设置默认值

在使用 nz-select 组件时，可以通过设置默认值 selectedValue 或者 ngModel 来设置默认选中的值。

使用 selectedValue

<nz-select [selectedValue]="defaultValue">
  <nz-option *ngFor="let option of options" [nzValue]="option.value" [nzLabel]="option.label"></nz-option>
</nz-select>

使用 ngModel

<nz-select [(ngModel)]="defaultValue">
  <nz-option *ngFor="let option of options" [nzValue]="option.value" [nzLabel]="option.label"></nz-option>
</nz-select>

在组件中，需要定义 defaultValue 属性，并设置默认的选中值。

export class MyComponent {
  defaultValue = 'value1';
  options = [
    { value: 'value1', label: 'Option 1' },
    { value: 'value2', label: 'Option 2' },
    { value: 'value3', label: 'Option 3' }
  ];
}

当然，也可以通过编程的方式来设置默认选中的值。

import { Component, ViewChild } from '@angular/core';
import { NzSelectComponent } from 'ng-zorro-antd/select';

export class MyComponent {
  @ViewChild('selectComponent') selectComponent: NzSelectComponent;

  ngAfterViewInit(): void {
    this.selectComponent.writeValue('value1');
  }
}