2016-11-23 2 views
1

Идея взята из hereзаменить шаблон с URL

У меня есть следующий код:

myApp.filter('parseUrlFilter', function() { 
var urlPattern = /^E\d{5}-\d{2}$/; 
return function (text, target) { 
    return text.replace(urlPattern, '<a target="' + target + '" href="http://somepage.com?number=$&">$&</a>') + " | "; 
}; 
}); 

Я все еще пытаюсь понять, как именно работает этот код, но он не преобразует текст на URL.

Как E12345-01 не стал somepage.com?number=E12345-01

Я думаю, что я что-то о том, как регулярное выражение работает здесь отсутствует. Любая помощь будет оценена.

Edit: добавлена ​​plnkr с несколько рабочим ответом machinehead115

ответ

1

Не видя вас HTML код, который я предполагаю, что вы на самом деле связывания/с использованием фильтра там, например, так:

<div ng-bind-html="'E12345-01' | parseUrlFilter:'_blank'"></div> 

Для того, чтобы иметь фильтр на самом деле выводить текст ссылки кода, который необходимо включить $sce как зависимость фильтра и возвращают ссылку с помощью $sce.trustAsHtml(link):

angular.module('app', []) 
    .filter('parseUrlFilter', function($sce) { 
    var urlPattern = /^E\d{5}-\d{2}$/; 
    return function(text, target) { 
     return $sce.trustAsHtml(text.replace(urlPattern, '<a target="' + target + '" href="http://somepage.com?number=$&">$&</a>') + ' | '); 
    }; 
    }); 

Вот пример plnk кода рабочего.

+0

Это именно то, что я искал. Два вопроса: 1) как работает sce? Я просто не мог понять, зачем нужен $ sce здесь. 2) Это не работает в моем коде прямо сейчас. Дает ошибку 'parseUrlFilterFilterProvider'. Я поддерживаю app.js, где я пишу общие службы/директивы и один controller.js. I D.I.это было в моем контроллере, но это дало еще одну подобную ошибку. Есть идеи, как я с этим справляюсь? –

+0

Сделано образец [plnk] (http://plnkr.co/edit/uhq2d2LQQ3LAqX2fCQrl?p=preview) –

+0

Здесь я обновил [plnk] (http://plnkr.co/edit/GuKyCrnERzgMUX2vqGJ8?p=preview) для тебя. Вам не нужно обертывать фильтр в 'document.ready()'. Взгляните на ссылку $ sce в моем ответе выше, но основная информация - . _SCE помогает в написании кода таким образом, что (а) является безопасным по умолчанию и (б) выполняет аудит для уязвимостей безопасности, таких как XSS, clickjacking, и т. д. намного проще ._ – machinehead115

-1

здесь является рабочим регулярное выражение для вас

([E]\d{5}-\d{2})

чек здесь https://regex101.com/r/O6YFlj/1

+0

Это не помогает его регулярное выражение, это делает его более универсальным, и он не делает ничего, чтобы на самом деле сделать ссылку появится на странице , – machinehead115

-1

Проблема не в вашем соответствия URL и код замены. Я извлек из вашего кода следующее и использовал его. Совершенствование работы:

<script> 
var urlPattern = /^E\d{5}-\d{2}$/; 
var text = "E12345-01"; 
document.write(text.replace(urlPattern, '<a href="http://somepage.com?number=$&">$&</a>') + " | "); 
</script> 

Проблема должна быть со значением текста. используйте console.log(text), чтобы узнать, получаете ли вы правильное значение в своей переменной или нет.

+0

Да, это работает, но это полностью отрицает использование '$ filter' в Angular. – machinehead115

+0

Хотя в его случае я думаю, что 'text! =" E12345-01 "' –

+0

@machineh Очевидно, что этот код должен был показать, что часть URL Matching работает нормально. – owaisafaq

0

Я не уверен, что понимаю ваш вопрос, а также ваш контекст. Мое предположение заключается в том, что вам нужно извлечь номер из входящей строки и использовать этот номер для создания новой строки ссылки. Учитывая эти требования, ниже получить вы собираетесь ...

//this var represents the string that would hold the identifier you're interested in 
var originString = "blah blah blah E12345-01 more blah blah blah"; 
function DoIt(incomingString) 
{ 
    //create a regex pattern 
    var urlPattern = new RegExp(/E\d{5}-\d{2}/); 
    //get the match 
    var theMatch = urlPattern.exec(incomingString); 
    //add the match to your new url 
    var returnString = "www.whateversite.com/number=" + theMatch; 
    //from here you can do whatever you want with that string 
    //for now, I'll just return it as is... 
    return returnString; 
} 
console.log(DoIt(originString)); 
Смежные вопросы