사용자 정의 유효성 검사를 ui-grid 셀 템플리트에 적용하는 방법

Question

사용자 정의 유효성 검증을 바인드하는 방법이 있습니까? 내 규칙 집합에 대해 입력을 확인하기 위해 ng-keydown에 메서드를 바인딩하고 싶습니다. 어떻게 그렇게 할 수 있습니다. ng-change에 $ scope 함수를 호출하려고했지만 작동하지 않았습니다.

나는 이것을 시도했다 ng-change="grid.appScope.checkValidaton($event,MODEL_COL_FIE‌​LD,true,true). scope 함수는 호출되지만 인수는 정의되지 않습니다. $ event와 ng-model을 어떻게 전달할 수 있습니까?

그리고 이것은 내 열입니다 : 나는이에서 내 참조했다

{ name: "group", editableCellTemplate: 
       "<div><input type=\"INPUT_TYPE\" ng-class=\"'colt' + col.uid\" ui-grid-editor ng-model=\"MODEL_COL_FIELD\" ng-change=\"grid.appScope.checkValidaton($event,MODEL_COL_FIELD,true,true)\"></div>", displayName: "Group", enableCellEdit: true, showSortMenu: false, cellTooltip: true 
       }, 

: 인터넷을 통해 검색 및 UI 그리드 이벤트에 대한 책을 읽은의 잠시 후 http://plnkr.co/edit/4Pvc4UYKSf71pIC2XrpY?p=preview

Answer 1

, 나는를 사용하는 지시어를 코딩 scope 엔티티 및 ui-grid 이벤트를 사용하여 셀 클릭시 유효성 검사를 적용합니다.

기본 트릭은 사용자 지정 편집 가능한 템플릿을 사용하고 해당 필드에서 유효성 검사를 적용하는 것이 었습니다. 여기

코드, 그것은 또한 내 저장소 here

(function(module){ 

    module.directive('gridValidation', gridValidationFn); 

    gridValidationFn.$inject = ['uiGridEditConstants']; 

    function gridValidationFn(uiGridEditConstants) { 
     var directive = { 
      restrict: 'A', 
      template: '<div><input type="text" ng-model="txtValue" ng-change="changeTxt(txtValue)"/></div>', 
      scope: true, 
      link: gridValidationLinkFn 
     }; 

     return directive; 

     function gridValidationLinkFn(scope, elm, attr) { 

      var oldTxt = scope.row.entity[scope.col.field]; 
      scope.limit = attr.limit; 
      scope.txtValue = oldTxt; 

      function windowClickListener(ev) { 
       if (ev.target.nodeName !== "INPUT") 
        scope.editDone(); 
      } 

      scope.changeTxt = function (val) { 
       if (attr.words) { 
        if (scope.txtValue && scope.txtValue.match(/\S+/g) && scope.txtValue.match(/\S+/g).length > Number(scope.limit)) { 
         scope.txtValue = scope.txtValue.split(/\s+/, Number(scope.limit)).join(" "); 
         scope.row.entity[scope.col.field] = scope.txtValue.split(/\s+/, Number(scope.limit)).join(" "); 
        } 
        else 
         scope.row.entity[scope.col.field] = scope.txtValue; 
       } 
       else { 
        if (scope.txtValue && scope.txtValue.length > Number(scope.limit)) { 
         scope.txtValue = scope.txtValue.slice(0, Number(scope.limit)); 
         scope.row.entity[scope.col.field] = scope.txtValue; 
        } 
        else 
         scope.row.entity[scope.col.field] = scope.txtValue; 
       } 
      }; 

      scope.editDone = function() { 
       scope.$emit(uiGridEditConstants.events.END_CELL_EDIT); 
      }; 

      scope.$on(uiGridEditConstants.events.BEGIN_CELL_EDIT, function() { 
       angular.element(window).on('click', windowClickListener); 
      }); 

      scope.$on('$destroy', function() { 
       angular.element(window).off('click', windowClickListener); 
      }); 
     } 

    } 
}(angular.module("ModuleName"))); 

그것은 나를 위해 잘 작동에서 찾을 수 있습니다. 희망이 다른 사람에게 도움이 될 것입니다