通过搜索关键字突出显示的Angular.js文本需要一个建议

时间:2015-12-28 10:42:53

标签: angularjs

我正在尝试使用搜索关键字进行文字突出显示。我尽力了。但我无法得到我所要求的结果。

现在我无意继续完成我的要求。任何人给出正确的建议或帮助我通过搜索关键字功能完成highlight

实际上我的search输入位于页面标题中。 (全局)我希望通过关键字条目突出显示页面中的文字。

这是我的代码:

var app = angular.module('plunker', []);

app.controller('headerController', function ($scope) {

  var replacer = function(match, item) {
            return '<span class="highlight">'+match+'</span>';
    }

  var tokenize = function(keywords) {
            keywords = keywords.replace(new RegExp(',$','g'), '').split(',');
            var i;
            var l = keywords.length;
            for (i=0;i<l;i++) {
                keywords[i] = '\\W'+keywords[i].replace(new RegExp('^ | $','g'), '')+'\\W';
            }
            return keywords;
        }

  $scope.search = {value:''}

  $scope.$watch('search.value', function(newval, oldval) {

    if(!newval) {
      return false;
    }

    var tokenized   = tokenize(newval); 
    var regex       = new RegExp(tokenized.join('|'), 'gmi');

   console.log( tokenized );

  })


})

app.controller('controller1', function($scope) {

  $scope.para1 = 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.';

});

app.controller('controller2', function($scope) {

  $scope.para2 = 'It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.';

});

app.controller('controller3', function($scope) {

  $scope.para3 = 'The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.';

});

Live Demo

0 个答案:

没有答案