7th One
<!DOCTYPE html>
<html ng-app="FormApp">
<head>
<title>AngularJS Form Validation</title>
<script src="[Link]
</head>
<body ng-controller="FormController">
<h2>Form with Validation</h2>
<!-- Key: Add 'name' to form and inputs for validation -->
<form name="userForm" ng-submit="submitForm()" novalidate>
<!-- Name Field -->
Name:<br>
<input type="text"
name="name"
ng-model="[Link]"
required
minlength="3">
<br>
<!-- Validation messages -->
<span ng-show="[Link].$touched && [Link].$[Link]">Name is
required.</span>
<span ng-show="[Link].$dirty && [Link].$[Link]">Name must be
at least 3 characters.</span>
<br><br>
<!-- Email Field -->
Email:<br>
<input type="email"
name="email"
ng-model="[Link]"
required>
<br>
<span ng-show="[Link].$touched && [Link].$[Link]">Email is
required.</span>
<span ng-show="[Link].$invalid && [Link].$dirty">Enter a valid
email.</span>
<br><br>
<!-- Age Field -->
Age:<br>
<input type="number"
name="age"
ng-model="[Link]"
required
min="18">
<br>
<span ng-show="[Link].$touched && [Link].$[Link]">Age is
required.</span>
<span ng-show="[Link].$valid && [Link] < 18">Must be 18 or older.</span>
<br><br>
<!-- Submit Button -->
<button type="submit" ng-disabled="userForm.$invalid">Submit</button>
<button type="button" ng-click="resetForm()">Reset</button>
</form>
<hr>
<!-- Show success message after submit -->
<div ng-if="formSubmitted">
<h3>✅ Form Submitted Successfully!</h3>
Name: {{ [Link] }}<br>
Email: {{ [Link] }}<br>
Age: {{ [Link] }}
</div>
<script>
[Link]('FormApp', [])
.controller('FormController', function($scope) {
$[Link] = {};
$[Link] = false;
$[Link] = {};
$[Link] = function() {
if ($[Link].$valid) {
$[Link] = {
name: $[Link],
email: $[Link],
age: $[Link]
};
$[Link] = true;
}
};
$[Link] = function() {
$[Link] = {};
$[Link].$setPristine();
$[Link].$setUntouched();
$[Link] = false;
};
});
</script>
</body>
</html>
8th One
<!DOCTYPE html>
<html ng-app="StringApp">
<head>
<title>All String Functions</title>
<script src="[Link]
</head>
<body ng-controller="StringCtrl">
<h1>All String Functions Demo</h1>
<p>
Enter text: <input type="text" ng-model="text">
<button ng-click="reset()">Reset</button>
</p>
<hr>
<p><strong>Original:</strong> "{{ text }}"</p>
<p><strong>Length:</strong> {{ [Link] }}</p>
<p><strong>Uppercase:</strong> {{ text | uppercase }}</p>
<p><strong>Lowercase:</strong> {{ text | lowercase }}</p>
<p><strong>Substring (0,6):</strong> "{{ [Link](0, 6) }}"</p>
<p><strong>Substr (2,5):</strong> "{{ [Link](2, 5) }}"</p>
<p><strong>Char at index 3:</strong> "{{ [Link](3) }}"</p>
<p><strong>Index of 'a':</strong> {{ [Link]('a') }}</p>
<p><strong>Last index of 'a':</strong> {{ [Link]('a') }}</p>
<p><strong>Trim spaces:</strong> "{{ [Link]() }}"</p>
<p><strong>Replace 'a' with 'X':</strong> "{{ [Link]('a', 'X') }}"</p>
<p><strong>Split by space:</strong> {{ [Link](' ') }}</p>
<p><strong>Includes 'hello'?:</strong> {{ [Link]('hello') }}</p>
<p><strong>Starts with 'H'?:</strong> {{ [Link]('H') }}</p>
<p><strong>Ends with '!'?:</strong> {{ [Link]('!') }}</p>
<p><strong>Concatenate:</strong> "{{ text + ' [Done]' }}"</p>
<p><strong>Title Case:</strong> {{ text | titleCase }}</p>
<script>
[Link]('StringApp', [])
// Custom filter to convert to Title Case
.filter('titleCase', function() {
return function(input) {
if (!input) return '';
return [Link](' ')
.map(function(word) {
return [Link](0).toUpperCase() +
[Link](1).toLowerCase();
})
.join(' ');
};
})
// Controller with initial data
.controller('StringCtrl', function($scope) {
$[Link] = " Hello World From AngularJS! ";
$[Link] = function() {
$[Link] = " Hello World From AngularJS! ";
};
});
</script>
</body>
</html>
