Angular.js - 入力から無効な文字をフィルタリングするためのコントローラ機能は、有効な文字が

Question

を入力されるまで、私は私がここで経験しています問題のJSFiddle作成した文字を削除しません：私は私の入力フィールドを持っているhttp://jsfiddle.net/9qxFK/4/

を小文字、数字、ハイフンのみを許可したい（このフィールドはURLで使用されます）。

私はこれを行うために、次のangular.jsのコントローラメソッドを持っています。有効な文字は、無効な文字の後に入力されたときに

$scope.auto_slug = function() { 
    $scope.slug = $scope.slug.toLowerCase().replace(/[^a-z0-9\-\s]/g, '').replace(/\s+/g, '-'); 
}; 

無効な文字のみが削除されています。

これはなぜ機能しないのですか？

おかげで、代わりに、あなたはこのように指令を使用する必要がありますコントローラ上でそれを行うのスコット

Answer 1

：その後、

app.directive('restrict', function($parse) { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     link: function(scope, iElement, iAttrs, controller) { 
      scope.$watch(iAttrs.ngModel, function(value) { 
       if (!value) { 
        return; 
       } 
       $parse(iAttrs.ngModel).assign(scope, value.toLowerCase().replace(new RegExp(iAttrs.restrict, 'g'), '').replace(/\s+/g, '-')); 
      }); 
     } 
    } 
});​ 

そして、このようなあなたのinputにそれを使用する：

<input restrict="[^a-z0-9\-\s]" data-ng-model="slug" ...> 

jsFiddl：http://jsfiddle.net/9qxFK/5/