$setValidity
usage of $setvalidity & $setViewValue
HTML
<div ng-app="myApp">
<div ng-controller="myController">
Search ID : <input type="text" ng-model="nam"/>
<div ng-repeat="da in data | filter : nam" class="divClass" >
<P class="spanClass"><input type="button" value='X' ng-click="delete(da.id)"/></P>
<p>id : {{da.id}}</p>
<p>Name : {{da.name}}</p>
</div>
<div id="dirDiv" hel="start" ng-model="h" my-directive ></div>
<form name="formname">
Enter Any name : <input type="text" name="inputname" ng-model="variable" my-directive />
<p ng-show="formname.inputname.$error.ind">Max count is reached</p>
<p ng-show="formname.inputname.$error.indspace">spacereached</p>
</form>
</div>
</div>
CSS
.divClass{
border: 5px solid grey;
//border-right: 5px solid grey;
width: 100px;
display : inline-block;
margin: 10px 10px 0px 10px;
}
.spanClass{
margin-left:75px
}
JavaScript
var app = angular.module("myApp", []);
app.controller("myController", function($scope, myFactory) {
$scope.start = "Hello !!"
$scope.data= myFactory.getData();
$scope.delete= function(id){
alert(id)
console.log($scope.data[id-1])
//$scope.data.pop({id: id, name :$scope.data[id-1].name})
$scope.data.splice(id-1,1)
}
})
app.factory("myFactory", function() {
var obj = {};
obj.getData = function() {
var da=[{id: 1, name: "samar"},{id: 2, name: "sourav"},{id: 3, name: "jyoti"},{id: 4, name: "samar"},{id: 5, name: "samar"}];
return da;
}
return obj;
})
app.directive("myDirective", function(){
return {
restrict:"EA",
scope:{
hel : "="
},
require :"ngModel",
link : function(scope,ele,attr,ctrl){
ele[0].style.color="red";
var fvalue="";
ctrl.$parsers.push(function(val){
//console.log(val);
if(val.trim().length >10){
ctrl.$setViewValue(fvalue);
ctrl.$render();
ctrl.$setValidity("ind", val.trim().length <10);
}else{
fvalue=val.toString();
ctrl.$setValidity("ind", val.trim().length >10);
}
if(val.indexOf(" ") > -1){
ctrl.$setValidity("indspace", false);
}else{
ctrl.$setValidity("indspace", true);
}
return fvalue;
})
},
template : '<input type="text" ng-keyup="cher()" ng-model="hel"/> {{hel}}{{err}}',
controller : function($scope){
$scope.che= function(){
console.log($scope.hel);
if($scope.hel.indexOf("@")>-1){
$scope.err="Name should not contain '@'"
}
}
}
}
})