Angular：根据键盘输入添加HTML标记到字符串

我有一个inputfield，并且我想在输入字段中填写输入到屏幕。不过，我想扫描输入文本，以打印某些文字粗体。Angular：根据键盘输入添加HTML标记到字符串

因此，举例来说，如果我打字：“你好你怎么样？”

我希望它的输入字段下进行打印，但你好必须以粗体显示： 你好，你好吗？

Angular有没有办法实现这一目标？

2015-05-09 STEP

要做到这一点，你必须更换要大胆与<b>Word</b>的话，你做，在你的控制器：

$scope.$watch('textInput', function(){ 
    $scope.formattedText = $scope.textInput.replace(/(Hello|SomeWord|OtherWord)/ig, "<b>$1</b>"); 
});

而且在模板

<div ng-bind-html="formattedText"></div>

*我用用正则表达式替换$1是匹配的字

* ng-bind-html指令渲染一个小号HTML而不是作为一个明文，它是由AngularJS一种安全的，它不会让你把HTML直接在{{ formattedText }}

来源

2015-05-09 10:39:42 Sn0opr

谢谢，这个作品！我想知道是否有办法让正则表达式为变量工作？我有一个可以检查的字符串列表。我猜这是不可能的正则表达式，但你永远不知道 – STEP

你可以将你的数组转换为一个字符串： 'var regex ='（'+ words.join（'|'）+'）'; '' 然后使用RegExp Javascript类： ''regexObject = new RegExp（regex，'ig'）;''然后在''.replace（regexObject，....）''函数中使用它'' *我没有测试代码tho – Sn0opr

谢谢，不知道RegExp！ – STEP

是的。您可以通过使用NgModelController（创建指令并使用require属性来访问此控制器）来实现它。

Here is a nice example它通过在所需控制器上实现$render方法来拦截输入并在渲染之前对其进行更改。

呈现的文本输入到一个大胆的另一个例子：http://jsbin.com/moxosorola/1/edit

注意，它不会改变ngModel本身的价值，但在方式呈现它（相同ngModel）要显示它通过使用自定义指令（bold-render）。

来源

2015-05-09 10:34:35

Angular：根据键盘输入添加HTML标记到字符串

回答

相关问题