AngularJSのfilterでテキストやHTMLを置換するフィルター

フィルターでテキスト置換

bind

フィルターでHTML置換

band

1
2
3
4
<h2>フィルターでテキスト置換</h2>
<p>{{foo | replace1:'ol':'in'}}</p>
<h2>フィルターでHTML置換</h2>
<p ng-bind-html="foo | replace2:'ol':'<b>an</b>'"></p>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var app = angular.module('app', []);
 
app.controller('Ctrl', ['$scope', function($scope) {
  $scope.foo = 'bold';
}]);
 
app.filter('replace1', [function() {
    return function (str, r1, r2) {
      return str.replace(r1, r2, 'g');
    };
  }
]);
 
app.filter('replace2', ['$sce', function($sce) {
    return function (str, r1, r2) {
      str = str.replace(r1, r2, 'g');
      return $sce.trustAsHtml(str);
    };
  }
]);