ng-class：为该标签添加class名，为此可以设置css样式，比如：
1 <!DOCTYPE html>
2 <html xmlns="http://www.w3.org/1999/xhtml" ng-app="myApp">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5 <title>form</title>
6 <script src="http://code.angularjs.org/angular-1.0.1.js"></script>
7 <style>
8 input {margin-bottom:10px;width:300px;height:30px;border:1px solid #ccc;border-radius:5px;padding:2px;}
9 lable{color:#555;font-size:14px;font-family:‘Microsoft YaHei‘}
10 .error{border:1px solid #ff0000}
11 </style>
12 </head>
13
14 <body ng-controller="maincontrol">
15 <form name="signupForm" ng-submit="sub()">
16 <div class="form">
17 <lable>用户名：</lable>
18 <input type="text" ng-model="input" name="username"
19 ng-class="{‘error‘:signupForm.username.$invalid &&signupForm.username.$touched}" ng-minlength="4" required />
20 </div>
21 </form>
22 </body>
23 <script>
24 angular.module(‘myApp‘, [])
25 .controller(‘maincontrol‘, function ($scope) {
26 $scope.sub = function () {
27 console.log(‘表单提交成功！‘);
28 }
29
30 })
31 </script>
signupForm.username.$invalid：表示输入不合法，
signupForm.username.$touched：表示只有在用户输入后，触摸后才会有此样式，但是现在的问题是，这个效果没有实现。究竟是为什么？angularjs的版本问题，稳定的https://code.angularjs.org/1.3.16/angular.min.js这个版本就可以 咯
时间： 2024-08-26 02:13:16