2014-10-08 41 views
0

如果您在框中键入A,你会看到:

  1. 阿拉巴马缺少在支架
  2. 阿拉斯加的文字是好的
  3. 亚利桑那州显示正常,但一旦选择节目作为<>

如何防止过滤器从消毒或任何想法(最好)用正确的编码和解码html字符?

http://jsfiddle.net/ZjPWe/64/

<div class="container"> 
    <div ng-controller="mainCtrl" class="row-fluid"> 
     <form class="row-fluid"> 
      <div class="container-fluid"> 
       <input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue" /> 
      </div> 
     </form> 
    </div> 
</div> 

...

angular.module('myApp', ['ui.bootstrap']) 
    .controller("mainCtrl", function ($scope) { 
    $scope.selected = ''; 
    $scope.states = ['Alabama <Where is this>', 'Alaska [this is ok]', 'Arizona &lt;Select Me&gt;']; 
}); 

回答

0

一个来解决这个问题不那么华丽的方式是应用过滤器来净化你的数组元素,然后选择时unsanitize他们。

http://jsfiddle.net/pwu0r81m/

$scope.$watch('selected', function() { 
    $scope.selected = $scope.selected.replace(new RegExp('&lt;', 'g'), '<').replace(new RegExp('&gt;', 'g'), '>'); 
}); 

angular.module('myApp') 
    .filter('sanitizer', function(){ 
     return function (items) { 
      var filtered = []; 
      angular.forEach(items, function(item){ 
       filtered.push(item.replace(new RegExp('<', 'g'), '&lt;').replace(new RegExp(">", 'g'), "&gt;")); 
      }); 
      return filtered; 
     } 
    });