Angular 4-如果ngModel不为空，则添加类

Angular是一种用于构建Web应用程序的开源JavaScript框架。Angular提供了一种将应用程序逻辑与DOM操作解耦的方式，使开发人员能够更轻松地开发功能强大且响应快速的Web应用程序。

Angular中的ngModel是一个指令，用于在表单元素和组件之间建立双向数据绑定。它使开发人员能够轻松地将表单控件的值与组件类中的变量绑定在一起。当ngModel绑定的值不为空时，可以通过一些方式来添加类。

一种常见的方法是使用ngClass指令。ngClass允许我们根据特定的条件动态地添加或移除类。当ngModel绑定的值不为空时，我们可以通过设置一个条件来添加类。

例如，假设我们有一个输入框，当用户输入文本时，希望为该输入框添加一个"notEmpty"类。可以按照以下步骤操作：

1. 在组件类中定义一个变量来存储输入框的值。例如：inputValue: string = '';
2. 在HTML模板中，使用ngModel绑定输入框的值：<input [(ngModel)]="inputValue">
3. 在输入框上使用ngClass指令，并设置一个条件来判断ngModel绑定的值是否为空：<input [(ngModel)]="inputValue" [ngClass]="{ 'notEmpty': inputValue !== '' }">
4. 在CSS样式表中定义".notEmpty"类的样式。

通过这样的设置，当输入框的值不为空时，将自动为该输入框添加"notEmpty"类。可以根据需要设置其他样式。

对于Angular 4，推荐使用腾讯云的产品云开发（Tencent CloudBase），它是腾讯云提供的一种基于云原生的全栈服务器less云开发平台，支持前端开发、后端开发、数据库和存储等多种功能。通过云开发，开发人员可以快速构建和部署具有高可用性和可扩展性的Web应用程序。

腾讯云开发产品介绍链接地址：https://cloud.tencent.com/product/tcb