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" ...> 

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