AngularJS textarea 指令
示例
带有数据绑定的文本区域
<textarea ng-model="myTextarea"></textarea>
<p>文本区域字段的值为：</p>
<h1>{{myTextarea}}</h1>
自己试试 »
定义和用法
AngularJS 修改了 <textarea> 元素的默认行为，但前提是存在 ng-model 属性。
它们提供数据绑定，这意味着它们是 AngularJS 模型的一部分，可以在 AngularJS 函数和 DOM 中引用和更新。
它们提供验证。例如：带有 required 属性的 <textarea> 元素，只要为空，其 $valid 状态就会设置为 false。
它们还提供状态控制。AngularJS 保存所有文本区域元素的当前状态。
文本区域字段具有以下状态
$untouched字段尚未被触碰$touched字段已被触碰$pristine字段尚未被修改$dirty字段已被修改$invalid字段内容无效$valid字段内容有效
每个状态的值表示一个布尔值，要么是 true，要么是 false。
语法
<textarea ng-model="name"></textarea>
可以通过使用 ng-model 属性的值来引用文本区域元素。
CSS 类
AngularJS 应用程序中的 <textarea> 元素会赋予某些类。这些类可用于根据其状态设置文本区域元素的样式。
添加以下类
ng-untouched字段尚未被触碰ng-touched字段已被触碰ng-pristine字段尚未被修改ng-dirty字段已被修改ng-valid字段内容有效ng-invalid字段内容无效ng-valid-key每个验证一个键。例如：ng-valid-required，当需要验证多个内容时很有用ng-invalid-key例如：ng-invalid-required
如果它们所代表的值为 false，则会移除这些类。
示例
使用标准 CSS 为有效和无效的文本区域元素应用样式
<style>
textarea.ng-invalid {
background-color: pink;
}
textarea.ng-valid {
background-color: lightgreen;
}
</style>
自己试试 »
