<br/>出现在搜索文本中

时间:2015-09-14 15:02:06

标签: javascript regex angularjs

我有一个模式,用户可以通过textarea添加备注。他们能够在文本区域中键入多个空格和换行符。添加注释后,它会立即显示在注释模式中。上面的输入字段允许用户搜索新创建的音符。突出显示跨度包装搜索到的文本。

我正在使用正则表达式创建&nbsp;<br/>,因此textarea中的格式显示在显示的注释中。

问题在于,已创建的&nbsp;<br/>会显示在高亮显示的搜索结果中。

突出显示过滤器

.filter('highlighted', function($sce) {
    return function (note, phrase) {
      if (phrase) {
        //phrase = phrase.replace(/^\&nbsp\;|<br?\>*/gi, "").replace().trim("");
        note = note.replace(new RegExp('(' + phrase + ')', 'gim'), '<span class="highlighted">$1</span>');
      }
      return $sce.trustAsHtml(note);
    };
  })

注意服务

noteService.getNotes(idPart)
  .success(function(result) {
    $scope.notes = result.notes;
    if ($scope.notes) {
      result.notes.forEach(function addDates(notes) {
        notes.dateSort = moment(notes.timestamp).format('MMMM D YYYY, h:mm:ss a');
        notes.timestamp = moment(notes.timestamp).format('MMM D, YYYY');
        notes.notes_raw = notes.note;
        var carriage = /\n/g,
          space = /\s/g,
          findCarriage = notes.note.replace(carriage, "<br/>"),
          newstr = findCarriage.replace(space, "&nbsp;");
        notes.note = newstr;
      });
    }
    console.log('success');
  })
  .error(function() {
    $scope.$emit('alert', 'danger', 'Failed to retrieve notes');
    console.log("failure");
    $modalInstance.close($scope.$parent.$id);
  });

HTML

<input type="text" class="form-control" ng-model="search.notes" placeholder="Search" aria-describedby="sizing-addon3" />

<ul class="notes-list">
    <li ng-repeat="note in notes | filter:search.notes | orderBy:'-dateSort'" class="note well">
      <span><strong ng-bind-html="note.timestamp | highlighted:search.notes"></strong> <em ng-bind-html="note.user | highlighted:search.notes"></em></span>
      <p ng-bind-html="note.note | highlighted:search.notes"></p>
     </li>
 </ul>

 <textarea autofocus class="form-control" rows="3" id="new-note" ng-model="data.note" maxlength="140" placeholder="Character limit 140 characters" required ng-focus="characterCount();"></textarea>
          <button type="submit" class="btn btn-xs btn-info" ng-disabled="partNotes.$invalid" ng-click="add()
          ">Add</button>
          <button type="submit" class="btn btn-xs btn-link" ng-click="clear()" formnovalidate>Clear</button>

0 个答案:

没有答案