Best JavaScript code snippet using ng-mocks
validation.js
Source:validation.js
1 'use strict';2 function getDateString(config) {3 var date = new Date(config.date),4 dateObject, months = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'];5 dateObject = {6 dd: date.getDate(),7 mm: date.getMonth() + 1,8 yy: date.getFullYear(),9 HH: date.getHours(),10 MN: date.getMinutes(),11 SS: date.getSeconds(),12 };13 if (dateObject.HH > 11) {14 dateObject.hh = 12 + dateObject.HH - 24;15 dateObject.AMPM = 'PM';16 } else {17 dateObject.hh = dateObject.HH;18 dateObject.AMPM = 'AM';19 }20 //find occurance of A exactly 1 times21 if (!/A{2}/i.test(config.format)) {22 config.format = config.format.replace(/A/ig, dateObject.AMPM);23 }24 //find occurance of s at least one and not more than 225 if (/s+/i.test(config.format) && !(/s{3}/i.test(config.format))) {26 if (/s{2}/i.test(config.format)) {27 //find occurance of s exactly 2 times28 config.format = config.format.replace(/ss/ig, dateObject.SS > 9 ? dateObject.SS : '0' + dateObject.SS);29 } else {30 //find occurance of s exactly 1 times31 config.format = config.format.replace(/s/ig, dateObject.SS);32 }33 }34 //find occurance of h at least one and not more than 235 if (/h+/.test(config.format) && !(/h{3}/.test(config.format))) {36 if (/h{2}/.test(config.format)) {37 //find occurance of h exactly 2 times38 config.format = config.format.replace(/hh/g, dateObject.hh > 9 ? dateObject.hh : '0' + dateObject.hh);39 } else {40 //find occurance of h exactly 1 times41 config.format = config.format.replace(/h/g, dateObject.hh);42 }43 }44 //find occurance of H at least one and not more than 245 if (/H+/.test(config.format) && !(/H{3}/.test(config.format))) {46 if (/H{2}/.test(config.format)) {47 //find occurance of H exactly 2 times48 config.format = config.format.replace(/HH/g, dateObject.HH > 9 ? dateObject.HH : '0' + dateObject.HH);49 } else {50 //find occurance of H exactly 1 times51 config.format = config.format.replace(/HH/g, dateObject.HH);52 }53 }54 //find occurance of T at least one and not more than 255 if (/T+/ig.test(config.format) && !(/T{3}/ig.test(config.format))) {56 if (/T{2}/i.test(config.format)) {57 //find occurance of T exactly 2 times58 config.format = config.format.replace(/tt/ig, dateObject.MN > 9 ? dateObject.MN : '0' + dateObject.MN);59 } else {60 //find occurance of T exactly 1 times61 config.format = config.format.replace(/t/ig, dateObject.MN);62 }63 }64 //find occurance of d at least one and not more than 265 if (/d+/i.test(config.format) && !(/d{3}/i.test(config.format))) {66 if (/d{2}/i.test(config.format)) {67 //find occurance of d exactly 2 times68 config.format = config.format.replace(/dd/ig, dateObject.dd > 9 ? dateObject.dd : '0' + dateObject.dd);69 } else {70 //find occurance of d exactly 1 times71 config.format = config.format.replace(/d/ig, dateObject.dd);72 }73 }74 //find occurance of y atleast 2 times75 if (/y+/i.test(config.format) && !(/y{5}/i.test(config.format))) {76 //find occurance of y exactly 4 times77 if (/y{4}/i.test(config.format)) {78 config.format = config.format.replace(/yyyy/ig, dateObject.yy);79 } else if (!/y{3,}/i.test(config.format)) {80 //find occurance of y not exactly 3 times i.e 2 times81 config.format = config.format.replace(/yy/ig, dateObject.yy.toString().substring(2));82 }83 }84 //find occurance of m at least one and not more than 385 if (/m+/i.test(config.format) && !(/m{4}/i.test(config.format))) {86 if (/m{3}/.test(config.format)) {87 //find occurance of m exactly 3 times88 config.format = config.format.replace(/mmm/ig, months[dateObject.mm - 1].toLowerCase());89 } else if (/M{3}/.test(config.format)) {90 //find occurance of M exactly 3 times91 config.format = config.format.replace(/MMM/ig, months[dateObject.mm].toUpperCase());92 } else if (/m{2,}/i.test(config.format)) {93 //find occurance of m exactly 2 times94 config.format = config.format.replace(/m{2,}/ig, dateObject.mm > 9 ? dateObject.mm : '0' + (dateObject.mm));95 } else {96 //find occurance of m exactly 1 times97 config.format = config.format.replace(/m{1,}/g, dateObject.mm);98 }99 }100 return config.format;101 }102 module.exports = angular103 .module('angular-ui-validator', [])104 .directive('uiForm', function() {105 return {106 controller: function($scope) {107 this.reset = function(modelKey) {108 $scope[modelKey] = null;109 $scope.$apply();110 };111 },112 link: function(scope, element, attrs, controller) {113 element.on('reset', function() {114 var children = element[0].children;115 for (var key in children) {116 switch (children[key].type) {117 case 'text':118 case 'url':119 case 'email':120 case 'password':121 case 'number':122 case 'tel':123 if (children[key].attributes['ng-model']) {124 controller.reset(children[key].attributes['ng-model'].value);125 break;126 }127 }128 }129 });130 element.on('submit', function() {131 if (scope[attrs.name].$invalid) {132 var error = scope[attrs.name].$error;133 for (var i in error) {134 error[i].forEach(function(each) {135 each.$setDirty();136 });137 }138 element.removeClass('ng-submitted');139 scope[attrs.name].$submitted = false;140 scope.$apply();141 } else {142 var submitFunction = scope[attrs.uiForm];143 if (submitFunction && typeof submitFunction === 'function') {144 submitFunction();145 }146 }147 });148 },149 restrict: 'A'150 };151 })152 .directive('uiRequired', function() {153 return {154 link: uiRequired,155 // scope: true,156 restrict: 'A',157 require: 'ngModel',158 priority: 90159 };160 })161 .directive('uiPattern', function() {162 return {163 link: uiPattern,164 restrict: 'A',165 scope: {166 uiPattern: '='167 },168 require: 'ngModel'169 };170 })171 .directive('uiEmail', function() {172 return {173 link: uiEmail,174 restrict: 'A',175 scope: true,176 require: 'ngModel',177 priority: 80178 };179 })180 .directive('uiUrl', function() {181 return {182 link: uiUrl,183 restrict: 'A',184 scope: true,185 require: 'ngModel'186 };187 })188 .directive('uiMinlength', function() {189 return {190 link: uiMinlength,191 restrict: 'A',192 scope: {193 uiMinlength: '='194 },195 require: 'ngModel'196 };197 })198 .directive('uiMaxlength', function() {199 return {200 link: uiMaxlength,201 restrict: 'A',202 scope: {203 uiMaxlength: '='204 },205 require: 'ngModel'206 };207 })208 .directive('uiLength', function() {209 return {210 link: uiLength,211 restrict: 'A',212 scope: {213 uiLength: '='214 },215 require: 'ngModel'216 };217 })218 .directive('uiAlphanum', function() {219 return {220 link: uiAlphanum,221 restrict: 'A',222 scope: true,223 require: 'ngModel'224 };225 })226 .directive('uiMinwords', function() {227 return {228 link: uiMinwords,229 restrict: 'A',230 scope: {231 uiMinwords: '='232 },233 require: 'ngModel'234 };235 })236 .directive('uiMaxwords', function() {237 return {238 link: uiMaxwords,239 restrict: 'A',240 scope: {241 uiMaxwords: '='242 },243 require: 'ngModel'244 };245 })246 .directive('uiWords', function() {247 return {248 link: uiWords,249 restrict: 'A',250 scope: {251 uiWords: '='252 },253 require: 'ngModel'254 };255 })256 .directive('uiEqualto', function() {257 return {258 link: uiEqualto,259 restrict: 'A',260 scope: {261 uiEqualto: '='262 },263 require: 'ngModel',264 priority: 50265 };266 })267 .directive('uiDigits', function() {268 return {269 link: uiDigits,270 restrict: 'A',271 scope: true,272 require: 'ngModel'273 };274 })275 .directive('uiMin', function() {276 return {277 link: uiMin,278 restrict: 'A',279 scope: {280 uiMin: '='281 },282 require: 'ngModel'283 };284 })285 .directive('uiMax', function() {286 return {287 link: uiMax,288 restrict: 'A',289 scope: {290 uiMax: '='291 },292 require: 'ngModel'293 };294 })295 .directive('uiRange', function() {296 return {297 link: uiRange,298 restrict: 'A',299 scope: {300 uiRange: '='301 },302 require: 'ngModel'303 };304 })305 .directive('uiMinDate', function() {306 return {307 link: uiMinDate,308 restrict: 'A',309 scope: {310 uiMinDate: '='311 },312 require: 'ngModel'313 };314 })315 .directive('uiMaxDate', function() {316 return {317 link: uiMaxDate,318 restrict: 'A',319 scope: {320 uiMaxDate: '='321 },322 require: 'ngModel'323 };324 })325 .directive('uiBetween', function() {326 return {327 link: uiBetween,328 restrict: 'A',329 scope: {330 uiBetween: '='331 },332 require: 'ngModel'333 };334 })335 .directive('uiInteger', function() {336 return {337 link: uiInteger,338 restrict: 'A',339 scope: {340 uiInteger: '='341 },342 require: 'ngModel'343 };344 })345 .directive('uiFloat', function() {346 return {347 link: uiFloat,348 restrict: 'A',349 scope: {350 uiFloat: '='351 },352 require: 'ngModel'353 };354 })355 .directive('uiNumber', function() {356 return {357 link: function(scope, element, attrs) {358 element.on('keydown', function(ev) {359 switch (ev.keyCode) {360 case 48:361 case 49:362 case 50:363 case 51:364 case 52:365 case 53:366 case 54:367 case 55:368 case 56:369 case 57:370 case 8:371 case 9:372 case 13:373 break;374 case 190:375 if (!attrs.uiNumber)376 ev.preventDefault();377 break;378 default:379 ev.preventDefault();380 break;381 }382 });383 },384 restrict: 'A',385 priority: 99386 };387 })388 .directive('uiAllowedUpto', function() {389 return {390 link: function(scope, element, attrs) {391 attrs.uiAllowedUpto = Number(attrs.uiAllowedUpto);392 if (!isNaN(attrs.uiAllowedUpto)) {393 element.on('keydown', function(ev) {394 switch (ev.keyCode) {395 case 8:396 case 9:397 case 13:398 break;399 default:400 if (element.val().length >= attrs.uiAllowedUpto) {401 ev.preventDefault();402 }403 break;404 }405 });406 }407 },408 restrict: 'A',409 priority: 95410 };411 })412 .directive('uiFormattedDate', function() {413 return {414 link: function(scope, element, attrs) {415 element.on('change', function() {416 element.val(getDateString({417 date: element.val(),418 format: attrs.uiFormattedDate419 }));420 });421 },422 restrict: 'A'423 };424 });425 function evaluateRegExp(regExp, value) {426 return new RegExp(regExp || '').test(value);427 }428 function countWords(value) {429 return value.match(/\S/g).length;430 }431 function compare(target, source) {432 if (target === source) {433 return 0;434 }435 if (target > source) {436 return 1;437 }438 return -1;439 }440 function init(element, ngModel) {441 ngModel.$setUntouched();442 ngModel.$setPristine();443 }444 function uiRequired(scope, element, attrs, ngModel) { //here is the model445 init(element, ngModel);446 ngModel.$validators.uiRequired = function(modelValue, viewValue) {447 var value = modelValue || viewValue;448 return value ? true : false;449 };450 }451 function uiPattern(scope, element, attrs, ngModel) {452 init(element, ngModel);453 ngModel.$parsers.push(function(viewValue) {454 var flag = evaluateRegExp(scope.uiPattern, viewValue);455 ngModel.$setValidity('uiPattern', flag);456 if (flag) {457 return viewValue;458 }459 });460 }461 function uiEmail(scope, element, attrs, ngModel) {462 init(element, ngModel);463 ngModel.$parsers.push(function(viewValue) {464 if (viewValue) {465 var flag = evaluateRegExp(/^[a-zA-Z0-9\-\_\.\+]+@[a-zA-Z0-9\-\_\.]+\.[a-zA-Z0-9\-\_]+$/, viewValue);466 ngModel.$setValidity('uiEmail', flag);467 if (flag) {468 return viewValue;469 }470 } else {471 return viewValue;472 }473 });474 }475 function uiUrl(scope, element, attrs, ngModel) {476 init(element, ngModel);477 ngModel.$parsers.push(function(viewValue) {478 if (viewValue) {479 var flag = evaluateRegExp(/(http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/, viewValue);480 ngModel.$setValidity('uiUrl', flag);481 if (flag) {482 return viewValue;483 }484 } else {485 return viewValue;486 }487 });488 }489 function uiMinlength(scope, element, attrs, ngModel) {490 init(element, ngModel);491 ngModel.$parsers.push(function(viewValue) {492 if (viewValue) {493 var flag = true;494 if (viewValue) {495 flag = evaluateRegExp('^.{' + scope.uiMinlength + ',}$', viewValue);496 }497 ngModel.$setValidity('uiMinLength', flag);498 if (flag) {499 return viewValue;500 }501 } else {502 return viewValue;503 }504 });505 }506 function uiMaxlength(scope, element, attrs, ngModel) {507 init(element, ngModel);508 ngModel.$parsers.push(function(viewValue) {509 if (viewValue) {510 var flag = evaluateRegExp('^.{0,' + scope.uiMaxlength + '}$', viewValue);511 ngModel.$setValidity('uiMaxLength', flag);512 if (flag) {513 return viewValue;514 }515 } else {516 return viewValue;517 }518 });519 }520 function uiLength(scope, element, attrs, ngModel) {521 init(element, ngModel);522 if (typeof scope.uiLength === 'object') {523 if (Array.isArray(scope.uiLength) && scope.uiLength.length === 2) {524 scope.uiLength.min = scope.uiLength[0] < scope.uiLength[1] ? scope.uiLength[0] : scope.uiLength[1];525 scope.uiLength.max = scope.uiLength[0] > scope.uiLength[1] ? scope.uiLength[0] : scope.uiLength[1];526 }527 ngModel.$parsers.push(function(viewValue) {528 if (viewValue) {529 var flag = true;530 if (viewValue) {531 flag = evaluateRegExp('^.{' + scope.uiLength.min + ',' + scope.uiLength.max + '}$', viewValue);532 }533 ngModel.$setValidity('uiLength', flag);534 if (flag) {535 return viewValue;536 }537 } else {538 return viewValue;539 }540 });541 }542 }543 function uiEqualto(scope, element, attrs, ngModel) {544 init(element, ngModel);545 ngModel.$parsers.push(function(viewValue) {546 var flag = true;547 if (viewValue) {548 flag = compare(viewValue, scope.uiEqualto) === 0 ? true : false;549 ngModel.$setValidity('uiEqualto', flag);550 if (flag) {551 return viewValue;552 }553 } else {554 return viewValue;555 }556 });557 }558 function uiAlphanum(scope, element, attrs, ngModel) {559 init(element, ngModel);560 ngModel.$parsers.push(function(viewValue) {561 if (viewValue) {562 var flag = true;563 if (viewValue) {564 flag = evaluateRegExp(/^[a-zA-Z0-9]+$/, viewValue);565 }566 ngModel.$setValidity('uiAlphanum', flag);567 if (flag) {568 return viewValue;569 }570 } else {571 return viewValue;572 }573 });574 }575 function uiMinwords(scope, element, attrs, ngModel) {576 init(element, ngModel);577 ngModel.$parsers.push(function(viewValue) {578 if (viewValue) {579 var flag = true;580 if (viewValue) {581 flag = compare(countWords(viewValue), (scope.uiMinwords || 0)) > -1 ? true : false;582 }583 ngModel.$setValidity('uiMinWords', flag);584 if (flag) {585 return viewValue;586 }587 } else {588 return viewValue;589 }590 });591 }592 function uiMaxwords(scope, element, attrs, ngModel) {593 init(element, ngModel);594 ngModel.$parsers.push(function(viewValue) {595 if (viewValue) {596 var flag = true;597 if (viewValue) {598 flag = compare(countWords(viewValue), scope.uiMaxwords) === 1 ? false : true;599 }600 ngModel.$setValidity('uiMaxWords', flag);601 if (flag) {602 return viewValue;603 }604 } else {605 return viewValue;606 }607 });608 }609 function uiWords(scope, element, attrs, ngModel) {610 init(element, ngModel);611 if (typeof scope.uiWords === 'object') {612 if (Array.isArray(scope.uiWords) && scope.uiWords.length === 2) {613 scope.uiWords.minWords =614 scope.uiWords[0] < scope.uiWords[1] ? scope.uiWords[0] : scope.uiWords[1];615 scope.uiWords.maxWords =616 scope.uiWords[0] > scope.uiWords[1] ? scope.uiWords[0] : scope.uiWords[1];617 }618 ngModel.$parsers.push(function(viewValue) {619 if (viewValue) {620 var flag = true,621 totalWords;622 if (viewValue) {623 totalWords = countWords(viewValue);624 flag = compare(totalWords >= scope.uiWords.minWords) &&625 compare(totalWords <= scope.uiWords.minWords);626 }627 ngModel.$setValidity('uiWords', flag);628 if (flag) {629 return viewValue;630 }631 } else {632 return viewValue;633 }634 });635 }636 }637 function uiDigits(scope, element, attrs, ngModel) {638 init(element, ngModel);639 ngModel.$parsers.push(function(viewValue) {640 if (viewValue) {641 var flag = evaluateRegExp(/^\d{1,}$/, viewValue);642 ngModel.$setValidity('uiDigits', flag);643 if (flag) {644 return viewValue;645 }646 } else {647 return viewValue;648 }649 });650 }651 function uiInteger(scope, element, attrs, ngModel) {652 init(element, ngModel);653 ngModel.$parsers.push(function(viewValue) {654 if (viewValue) {655 var flag = evaluateRegExp(/^\d+$/, viewValue);656 ngModel.$setValidity('uiInteger', flag);657 if (flag) {658 return viewValue;659 }660 } else {661 return viewValue;662 }663 });664 }665 function uiFloat(scope, element, attrs, ngModel) {666 init(element, ngModel);667 ngModel.$parsers.push(function(viewValue) {668 if (viewValue) {669 var flag = evaluateRegExp(/^\d+.\d+$/, viewValue);670 ngModel.$setValidity('uiFloat', flag);671 if (flag) {672 return viewValue;673 }674 } else {675 return viewValue;676 }677 });678 }679 function uiMin(scope, element, attrs, ngModel) {680 init(element, ngModel);681 ngModel.$parsers.push(function(viewValue) {682 if (viewValue) {683 var flag = Number(viewValue) >= scope.uiMin ? true : false;684 ngModel.$setValidity('uiMin', flag);685 if (flag) {686 return viewValue;687 }688 } else {689 return viewValue;690 }691 });692 }693 function uiMax(scope, element, attrs, ngModel) {694 init(element, ngModel);695 ngModel.$parsers.push(function(viewValue) {696 if (viewValue) {697 var flag = Number(viewValue) <= scope.uiMax ? true : false;698 ngModel.$setValidity('uiMax', flag);699 if (flag) {700 return viewValue;701 }702 } else {703 return viewValue;704 }705 });706 }707 function uiRange(scope, element, attrs, ngModel) {708 init(element, ngModel);709 if (typeof scope.uiRange === 'object') {710 if (Array.isArray(scope.uiRange) && scope.uiRange.length === 2) {711 scope.uiRange.min = scope.uiRange[0] < scope.uiRange[1] ? scope.uiRange[0] : scope.uiRange[1];712 scope.uiRange.max = scope.uiRange[0] > scope.uiRange[1] ? scope.uiRange[0] : scope.uiRange[1];713 }714 ngModel.$parsers.push(function(viewValue) {715 if (viewValue) {716 var temp = Number(viewValue);717 var flag = (temp >= scope.uiRange.min) && (temp <= scope.uiRange.max) ? true : false;718 ngModel.$setValidity('uiRange', flag);719 if (flag) {720 return viewValue;721 }722 } else {723 return viewValue;724 }725 });726 }727 }728 function uiMinDate(scope, element, attrs, ngModel) {729 init(element, ngModel);730 ngModel.$parsers.push(function(viewValue) {731 if (viewValue) {732 var flag = compare(new Date(viewValue), new Date(scope.uiMinDate)) > -1 ? true : false;733 ngModel.$setValidity('uiMinDate', flag);734 if (flag) {735 return viewValue;736 }737 } else {738 return viewValue;739 }740 });741 }742 function uiMaxDate(scope, element, attrs, ngModel) {743 init(element, ngModel);744 ngModel.$parsers.push(function(viewValue) {745 if (viewValue) {746 var flag = compare(new Date(viewValue), new Date(scope.uiMaxDate)) != 1 ? true : false;747 ngModel.$setValidity('uiMaxDate', flag);748 if (flag) {749 return viewValue;750 }751 } else {752 return viewValue;753 }754 });755 }756 function uiBetween(scope, element, attrs, ngModel) {757 init(element, ngModel);758 if (typeof scope.uiBetween === 'object') {759 if (Array.isArray(scope.uiBetween) && scope.uiBetween.length === 2) {760 scope.uiBetween.minBetween =761 scope.uiBetween[0] < scope.uiBetween[1] ? scope.uiBetween[0] : scope.uiBetween[1];762 scope.uiBetween.maxBetween =763 scope.uiBetween[0] > scope.uiBetween[1] ? scope.uiBetween[0] : scope.uiBetween[1];764 }765 ngModel.$parsers.push(function(viewValue) {766 if (viewValue) {767 var flag = true;768 flag = compare(new Date(viewValue), new Date(scope.uiBetween.minBetween)) > -1 &&769 compare(new Date(viewValue), new Date(scope.uiBetween.maxBetween)) < 1;770 ngModel.$setValidity('uiBetween', flag);771 if (flag) {772 return viewValue;773 }774 } else {775 return viewValue;776 }777 });778 }...
app.ts
Source:app.ts
1/**2 * @license3 * Copyright Google Inc. All Rights Reserved.4 *5 * Use of this source code is governed by an MIT-style license that can be6 * found in the LICENSE file at https://angular.io/license7 */8import {Component, NgModule} from '@angular/core';9import {FormsModule} from '@angular/forms';10import {BrowserModule} from '@angular/platform-browser';11@Component({12 selector: 'app',13 template: `<form *ngFor="let copy of copies">14<input type="text" [(ngModel)]="values[0]" name="value0">15<input type="text" [(ngModel)]="values[1]" name="value1">16<input type="text" [(ngModel)]="values[2]" name="value2">17<input type="text" [(ngModel)]="values[3]" name="value3">18<input type="text" [(ngModel)]="values[4]" name="value4">19<input type="text" [(ngModel)]="values[5]" name="value5">20<input type="text" [(ngModel)]="values[6]" name="value6">21<input type="text" [(ngModel)]="values[7]" name="value7">22<input type="text" [(ngModel)]="values[8]" name="value8">23<input type="text" [(ngModel)]="values[9]" name="value9">24<input type="text" [(ngModel)]="values[10]" name="value10">25<input type="text" [(ngModel)]="values[11]" name="value11">26<input type="text" [(ngModel)]="values[12]" name="value12">27<input type="text" [(ngModel)]="values[13]" name="value13">28<input type="text" [(ngModel)]="values[14]" name="value14">29<input type="text" [(ngModel)]="values[15]" name="value15">30<input type="text" [(ngModel)]="values[16]" name="value16">31<input type="text" [(ngModel)]="values[17]" name="value17">32<input type="text" [(ngModel)]="values[18]" name="value18">33<input type="text" [(ngModel)]="values[19]" name="value19">34<input type="text" [(ngModel)]="values[20]" name="value20">35<input type="text" [(ngModel)]="values[21]" name="value21">36<input type="text" [(ngModel)]="values[22]" name="value22">37<input type="text" [(ngModel)]="values[23]" name="value23">38<input type="text" [(ngModel)]="values[24]" name="value24">39<input type="text" [(ngModel)]="values[25]" name="value25">40<input type="text" [(ngModel)]="values[26]" name="value26">41<input type="text" [(ngModel)]="values[27]" name="value27">42<input type="text" [(ngModel)]="values[28]" name="value28">43<input type="text" [(ngModel)]="values[29]" name="value29">44<input type="text" [(ngModel)]="values[30]" name="value30">45<input type="text" [(ngModel)]="values[31]" name="value31">46<input type="text" [(ngModel)]="values[32]" name="value32">47<input type="text" [(ngModel)]="values[33]" name="value33">48<input type="text" [(ngModel)]="values[34]" name="value34">49<input type="text" [(ngModel)]="values[35]" name="value35">50<input type="text" [(ngModel)]="values[36]" name="value36">51<input type="text" [(ngModel)]="values[37]" name="value37">52<input type="text" [(ngModel)]="values[38]" name="value38">53<input type="text" [(ngModel)]="values[39]" name="value39">54<input type="text" [(ngModel)]="values[40]" name="value40">55<input type="text" [(ngModel)]="values[41]" name="value41">56<input type="text" [(ngModel)]="values[42]" name="value42">57<input type="text" [(ngModel)]="values[43]" name="value43">58<input type="text" [(ngModel)]="values[44]" name="value44">59<input type="text" [(ngModel)]="values[45]" name="value45">60<input type="text" [(ngModel)]="values[46]" name="value46">61<input type="text" [(ngModel)]="values[47]" name="value47">62<input type="text" [(ngModel)]="values[48]" name="value48">63<input type="text" [(ngModel)]="values[49]" name="value49">64</form>`65})66export class AppComponent {67 copies: number[] = [];68 values: string[] = [];69 constructor() {70 for (let i = 0; i < 50; i++) {71 this.values[i] = `someValue${i}`;72 }73 }74 setCopies(count: number) {75 this.copies = [];76 for (let i = 0; i < count; i++) {77 this.copies.push(i);78 }79 }80}81@NgModule({82 imports: [BrowserModule, FormsModule],83 bootstrap: [AppComponent],84 declarations: [AppComponent]85})86export class AppModule {...
alarmDirective.js
Source:alarmDirective.js
1/*jslint node: true */2/*jshint strict: false */3/*jslint jquery: true*/4/*global angular: false */5/*global moment: false */6'use strict';7angular.module('alarmModule')8 .directive("checkboxToggle", checkboxToggle)9 .directive('timepicker', timepicker)10 .directive('datetimepicker', datetimepicker);11 checkboxToggle.$inject = [];12 function checkboxToggle() {13 /**14 * Directive15 */16 return {17 restrict: 'A',18 transclude: true,19 replace: false,20 require: 'ngModel',21 link: function ($scope, $element, $attr, require) {22 var ngModel = require;23 // update model from Element24 var updateModelFromElement = function() {25 // If modified26 var checked = $element.prop('checked');27 if (checked != ngModel.$viewValue) {28 // Update ngModel29 ngModel.$setViewValue(checked);30 $scope.$apply();31 }32 };33 // Update input from Model34 var updateElementFromModel = function() {35 // Update button state to match model36 $element.trigger('change');37 };38 // Observe: Element changes affect Model39 $element.on('change', function() {40 updateModelFromElement();41 });42 // Observe: ngModel for changes43 $scope.$watch(function() {44 return ngModel.$viewValue;45 }, function() {46 updateElementFromModel();47 });48 // Initialise BootstrapToggle49 $element.bootstrapToggle();50 }51 };52 }53timepicker.$inject = ['$window'];54function timepicker ($window) {55 return {56 require: '?ngModel',57 restrict: 'A',58 link: function(scope, element, attrs, ngModel){59 var langKey = $window.localStorage.getItem('langKey');60 if(!ngModel) return; // do nothing if no ng-model61 ngModel.$render = function(){62 element.find('input').val( ngModel.$viewValue || '' );63 };64 element.datetimepicker({65 language: langKey,66 pickDate: false,67 pickSeconds: false,68 pick12HourFormat: false,69 use24hours: true,70 pickTime: true,71 format: 'HH:mm'72 });73 element.on('dp.change', function(){74 scope.$apply(read);75 });76 read();77 function read() {78 var value = element.find('input').val();79// console.log(value);80 ngModel.$setViewValue(value);81 }82 }83 };84}85datetimepicker.$inject = ['$window'];86function datetimepicker ($window) {87 return {88 require: '?ngModel',89 restrict: 'A',90 link: function(scope, element, attrs, ngModel){91 var langKey = $window.localStorage.getItem('langKey');92 element.datetimepicker({93 language: langKey,94 format: 'DD-MM-YYYY HH:mm:00'95 });96 if(!ngModel) return; // do nothing if no ng-model97 ngModel.$render = function(){98 element.find('input').val( ngModel.$viewValue || '' );99 };100 element.on('dp.change', function(){101 scope.$apply(read);102 });103 read();104 function read() {105 var value = element.find('input').val();106// console.log(value);107 ngModel.$setViewValue(value);108 }109 }110 };111 ...
Using AI Code Generation
1import { MockBuilder, MockRender, ngMocks } from 'ng-mocks';2import { AppComponent } from './app.component';3import { AppModule } from './app.module';4import { FormsModule } from '@angular/forms';5describe('AppComponent', () => {6 beforeEach(() => MockBuilder(AppComponent, AppModule).mock(FormsModule));7 it('should create the app', () => {8 const fixture = MockRender(AppComponent);9 const app = ngMocks.findInstance(AppComponent);10 expect(app).toBeTruthy();11 });12 it('should have as title "ng-mocks" in the template', () => {13 const fixture = MockRender(AppComponent);14 const app = ngMocks.findInstance(AppComponent);15 expect(ngMocks.formatText(fixture)).toContain('ng-mocks');16 });17 it('should have as title "ng-mocks" in the component', () => {18 const fixture = MockRender(AppComponent);19 const app = ngMocks.findInstance(AppComponent);20 expect(app.title).toEqual('ng-mocks');21 });22 it('should have as title "ng-mocks" in the DOM', () => {23 const fixture = MockRender(AppComponent);24 const app = ngMocks.findInstance(AppComponent);25 expect(ngMocks.formatText(fixture.nativeElement)).toContain('ng-mocks');26 });27 it('should have as title "ng-mocks" in the template', () => {28 const fixture = MockRender(AppComponent);29 const app = ngMocks.findInstance(AppComponent);30 expect(ngMocks.formatText(fixture)).toContain('ng-mocks');31 });32 it('should have as title "ng-mocks" in the DOM', () => {33 const fixture = MockRender(AppComponent);34 const app = ngMocks.findInstance(AppComponent);35 expect(ngMocks.formatText(fixture.nativeElement)).toContain('ng-mocks');36 });37 it('should have as title "ng-mocks" in the template', () => {38 const fixture = MockRender(AppComponent);39 const app = ngMocks.findInstance(AppComponent);40 expect(ngMocks.formatText(fixture)).toContain('ng-mocks');41 });42 it('should have as title "ng-mocks" in the DOM', () => {43 const fixture = MockRender(AppComponent);44 const app = ngMocks.findInstance(AppComponent);45 expect(ngMocks.formatText(fixture.nativeElement)).toContain('ng-mocks');46 });47 it('
Using AI Code Generation
1import { ngMocks } from 'ng-mocks';2import { MyComponent } from './my.component';3describe('MyComponent', () => {4 it('should render title', () => {5 const fixture = ngMocks.faster(MyComponent);6 const label = ngMocks.find('label').nativeElement;7 expect(label).toHaveText('test');8 ngMocks.input(label, 'test2');9 expect(label).toHaveText('test2');10 });11});12import { Component } from '@angular/core';13@Component({14})15export class MyComponent {16 title = 'test';17}18import { ComponentFixture, TestBed } from '@angular/core/testing';19import { FormsModule } from '@angular/forms';20import { MyComponent } from './my.component';21describe('MyComponent', () => {22 let component: MyComponent;23 let fixture: ComponentFixture<MyComponent>;24 beforeEach(async () => {25 await TestBed.configureTestingModule({26 imports: [FormsModule],27 }).compileComponents();28 });29 beforeEach(() => {30 fixture = TestBed.createComponent(MyComponent);31 component = fixture.componentInstance;32 fixture.detectChanges();33 });34 it('should render title', () => {35 const label = fixture.nativeElement.querySelector('label');36 expect(label).toHaveText('test');37 label.value = 'test2';38 label.dispatchEvent(new Event('input'));39 expect(label).toHaveText('test2');40 });41});42import { ComponentFixture, TestBed } from '@angular/core/testing';43import { FormsModule } from '@angular/forms';44import { MyComponent } from './my.component';45describe('MyComponent', () => {46 let component: MyComponent;47 let fixture: ComponentFixture<MyComponent>;48 beforeEach(async () => {49 await TestBed.configureTestingModule({50 imports: [FormsModule],51 }).compileComponents();52 });53 beforeEach(() => {54 fixture = TestBed.createComponent(MyComponent);55 component = fixture.componentInstance;56 fixture.detectChanges();57 });58 it('should render title', () => {59 const label = fixture.nativeElement.querySelector('label');60 expect(label).toHaveText('test');61 label.value = 'test2';62 label.dispatchEvent(new Event('input'));63 expect(label).toHaveText('test2');64 });
Using AI Code Generation
1import { ngMocks } from 'ng-mocks';2import { FormsModule } from '@angular/forms';3import { MyComponent } from './my.component';4beforeEach(() => {5 ngMocks.globalMock(FormsModule);6});7it('should work', () => {8 const fixture = ngMocks.faster(MyComponent);9 fixture.detectChanges();10 const input = ngMocks.find('input');11});12import { Component } from '@angular/core';13@Component({14 <input [(ngModel)]="value" />15})16export class MyComponent {17 public value = '';18}19import { ngMocks } from 'ng-mocks';20import { FormsModule } from '@angular/forms';21import { MyComponent } from './my.component';22beforeEach(() => {23 ngMocks.globalMock(FormsModule);24});25it('should work', () => {26 const fixture = ngMocks.faster(MyComponent);27 fixture.detectChanges();28 const input = ngMocks.find('input');29});30<input [(ngModel)]="value" />31import { ngMocks } from 'ng-mocks';32import { FormsModule } from '@angular/forms';33import { MyComponent } from './my.component';34beforeEach(() => {35 ngMocks.globalMock(FormsModule);36});37it('should work', () => {38 const fixture = ngMocks.faster(MyComponent);39 fixture.detectChanges();40 const input = ngMocks.find('input');41});42<input [(ngModel)]="value" />43import { ngMocks } from 'ng-mocks';44import { FormsModule } from '@angular/forms';45import { MyComponent } from './my.component';46beforeEach(() => {47 ngMocks.globalMock(FormsModule);48});49it('should work', () => {50 const fixture = ngMocks.faster(MyComponent);
Using AI Code Generation
1import { ngMocks } from 'ng-mocks';2import { MyComponent } from './my.component';3describe('ng-mocks', () => {4 it('should be able to get ngModel', () => {5 const fixture = ngMocks.faster(MyComponent);6 const ngModel = ngMocks.find(fixture, 'input').ngModel;7 expect(ngModel).toBeDefined();8 expect(ngModel.value).toEqual('hello world');9 });10});11import { Component } from '@angular/core';12import { FormControl } from '@angular/forms';13@Component({14})15export class MyComponent {16 formControl = new FormControl('hello world');17}18import { ComponentFixture, TestBed } from '@angular/core/testing';19import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';20import { MyComponent } from './my.component';21describe('MyComponent', () => {22 let component: MyComponent;23 let fixture: ComponentFixture<MyComponent>;24 beforeEach(async () => {25 await TestBed.configureTestingModule({26 imports: [FormsModule, ReactiveFormsModule],27 }).compileComponents();28 });29 beforeEach(() => {30 fixture = TestBed.createComponent(MyComponent);31 component = fixture.componentInstance;32 fixture.detectChanges();33 });34 it('should create', () => {35 expect(component).toBeTruthy();36 });37 it('should be able to get ngModel', () => {38 const ngModel = fixture.nativeElement.querySelector('input').ngModel;39 expect(ngModel).toBeDefined();40 expect(ngModel.value).toEqual('hello world');41 });42});43import { Component } from '@angular/core';44import { FormControl } from '@angular/forms';45@Component({46})47export class MyComponent {48 formControl = new FormControl('hello world');49}
Using AI Code Generation
1import { ngMocks } from 'ng-mocks';2describe('my test', () => {3 it('should work', () => {4 const fixture = ngMocks.find('my-component');5 const component = ngMocks.get(fixture);6 });7});8import { ngMocks } from 'ng-mocks';9beforeEach(() => {10 ngMocks.faster();11});12import { ngMocks } from 'ng-mocks';13beforeEach(() => {14 ngMocks.defaultMock(DependencyService, {15 someMethod: () => 'mocked',16 });17});18import { ngMocks } from 'ng-mocks';19beforeEach(() => {20 ngMocks.defaultMock(DependencyService, {21 someMethod: () => 'mocked',22 });23});24import { ngMocks } from 'ng-mocks';25beforeEach(() => {26 ngMocks.defaultMock(DependencyService, {27 someMethod: () => 'mocked',28 });29});30import { ngMocks } from 'ng-mocks';31beforeEach(() => {32 ngMocks.defaultMock(DependencyService, {33 someMethod: () => 'mocked',34 });35});36import { ngMocks } from 'ng-mocks';37beforeEach(() => {38 ngMocks.defaultMock(DependencyService, {39 someMethod: () => 'mocked',40 });41});42import { ngMocks } from 'ng-mocks';43beforeEach(() => {44 ngMocks.defaultMock(DependencyService, {45 someMethod: () => 'mocked',46 });47});48import { ngMocks } from 'ng-mocks';49beforeEach(() => {
Using AI Code Generation
1var ngModel = ngMocks.findModel('myModel');2ngModel.$setViewValue('some value');3ngModel.$render();4ngModel.$setViewValue('some other value');5ngModel.$render();6ngModel.$setViewValue('some other value');7ngModel.$render();8ngModel.$setViewValue('some other value');9ngModel.$render();
Using AI Code Generation
1import { MockBuilder, MockRender, MockInstance } from 'ng-mocks';2import { AppComponent } from './app.component';3import { SomeService } from './some.service';4import { SomeOtherService } from './some-other.service';5import { SomeThirdService } from './some-third.service';6import { SomeFourthService } from './some-fourth.service';7import { SomeFifthService } from './some-fifth.service';8import { SomeSixthService } from './some-sixth.service';9import { SomeSeventhService } from './some-seventh.service';10import { SomeEighthService } from './some-eighth.service';11import { SomeNinthService } from './some-ninth.service';12import { SomeTenthService } from './some-tenth.service';13import { SomeEleventhService } from './some-eleventh.service';14import { SomeTwelfthService } from './some-twelfth.service';15import { SomeThirteenthService } from './some-thirteenth.service';16import { SomeFourteenthService } from './some-fourteenth.service';17import { SomeFifteenthService } from './some-fifteenth.service';18import { SomeSixteenthService } from './some-sixteenth.service';19import { SomeSeventeenthService } from './some-seventeenth.service';20import { SomeEighteenthService } from './some-eighteenth.service';21import { SomeNineteenthService } from './some-nineteenth.service';22import { SomeTwentiethService } from './some-twentieth.service';23import { SomeTwentyFirstService } from './some-twenty-first.service';24import { SomeTwentySecondService } from './some
Using AI Code Generation
1import { mock } from 'ng-mocks';2import { AppComponent } from './app.component';3describe('AppComponent', () => {4 it('should be created', () => {5 const fixture = mock(AppComponent);6 expect(fixture).toBeTruthy();7 });8});
Using AI Code Generation
1describe('ngModel directive', function() {2 var $compile, $rootScope, $timeout;3 beforeEach(module('ngModelApp'));4 beforeEach(inject(function(_$compile_, _$rootScope_, _$timeout_) {5 $compile = _$compile_;6 $rootScope = _$rootScope_;7 $timeout = _$timeout_;8 }));9 it('should set the value of the model variable to AngularJS', function() {10 var element = $compile('<input ng-model="model" />')($rootScope);11 $rootScope.$digest();12 ngModel(element).$setViewValue('AngularJS');13 $timeout.flush();14 $timeout.verifyNoPendingTasks();15 expect(ngModel(element).$viewValue).toBe('AngularJS');16 });17 it('should set the value of the view variable to AngularJS', function()
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Get 100 minutes of automation test minutes FREE!!