Ng DevUI 14.1.0版本已发布，看看有哪些新特性吧！

Ng DevUI 14.1.0版本新特性介绍

Ng DevUI 14.1.0版本是最新发布的版本，其中包含了许多令人激动的新特性和增强功能。本文将重点介绍一些主要的新特性，让我们了解一下吧！

1. 新增了数据表格的折叠功能

在Ng DevUI 14.1.0版本中，引入了数据表格的折叠功能。这个新特性使得在展示大量数据时更加轻松，并且有助于提高用户的交互体验。当数据行中的某个字段满足特定条件时，用户可以通过点击折叠按钮快速展开或折叠相关的附加信息。

<dui-datatable>
  <dui-datatable-column>
    <ng-template let-item>
      {{item.name}}
      <div *duiRowExpand>
        <p>{{item.description}}</p>
        <p>{{item.details}}</p>
      </div>
    </ng-template>
  </dui-datatable-column>
</dui-datatable>

2. 新增了动态表单验证

另一个令人振奋的新增功能是动态表单验证。这使得在表单中应用自定义验证器变得更加容易。无论是在输入框中的实时验证，还是在整个表单提交时的验证，都可以方便地通过简单的配置和自定义验证函数来实现。

<dui-form [model]="user" (ngSubmit)="submitForm()">
  <dui-form-group>
    <dui-form-control name="username" required minlength="5" maxlength="20"></dui-form-control>
  </dui-form-group>
  <dui-form-group>
    <dui-form-control name="password" required minlength="8"></dui-form-control>
  </dui-form-group>
  <button type="submit">提交</button>
</dui-form>

3. 支持移动端响应式布局

Ng DevUI 14.1.0版本还增加了对移动端的支持，使得应用在不同移动设备上的显示效果更加出色。无论是在iOS还是Android设备上，新的响应式布局能够自适应不同屏幕大小和分辨率，并提供更好的用户体验。

<dui-container duiResponsiveLayout>
  <dui-row>
    <dui-col [width]="6" duiLayoutSm="12">左侧内容</dui-col>
    <dui-col [width]="6" duiLayoutSm="12">右侧内容</dui-col>
  </dui-row>
</dui-container>

总结

Ng DevUI 14.1.0版本带来了许多令人兴奋的新特性和增强功能。我们介绍了其中的三个重要新特性：数据表格的折叠功能、动态表单验证和移动端响应式布局。这些功能的引入使得开发者能够更加轻松地构建复杂的应用，并提供更优秀的用户体验。