Rate评分

    • 对评价进行展示。
    • 对事物进行快速的评级操作。

    想要了解更多关于单独引入组件的内容,可以在快速上手页面进行查看。

    最简单的用法。

    1. @Component({
    2. selector: 'nz-demo-rate-basic',
    3. template: `
    4. `
    5. })
    6. export class NzDemoRateBasicComponent {}

    Rate评分 - 图2

    文案展现

    支持允许或者禁用清除。

    1. import { Component } from '@angular/core';
    2. @Component({
    3. selector: 'nz-demo-rate-clear',
    4. template: `
    5. <nz-rate [(ngModel)]="value" nzAllowHalf></nz-rate>
    6. <span class="ant-rate-text">allowClear: true</span>
    7. <br />
    8. <nz-rate [(ngModel)]="value" nzAllowHalf [nzAllowClear]="false"></nz-rate>
    9. <span class="ant-rate-text">allowClear: false</span>
    10. })
    11. export class NzDemoRateClearComponent {
    12. }

    Rate评分 - 图4

    半星

    只读,无法进行鼠标交互。

    1. import { Component } from '@angular/core';
    2. @Component({
    3. selector: 'nz-demo-rate-disabled',
    4. template: `
    5. <nz-rate [ngModel]="2" nzDisabled></nz-rate>
    6. `
    7. })
    8. export class NzDemoRateDisabledComponent {}

    Rate评分 - 图6

    其他字符

    方法

    名称描述
    blur()移除焦点
    focus()获取焦点