有没有办法将粗体应用于角度 js 中 textarea 中的选定文本？

Posted 2023-05-07

【中文标题】有没有办法将粗体应用于角度 js 中 textarea 中的选定文本？

【英文标题】：Is there a way to apply bold to selected text in textarea in angular js?

【发布时间】：2015-12-12 13:26:45

【问题描述】：

我想创建一个使文本区域文本变粗的按钮。我使用了here 中的示例，并成功地将文本设置为粗体。但现在我想让选定的文本只加粗。有没有办法做到这一点。 这是我的代码。

.text_type_bold 
        font-style: none;
        font-weight: bold;
    



$scope.textBold = function () 
        $scope.class = "text_type_bold";
    ;

 <div>           
<button ng-click="textBold()" class="btn btn-sm"><b>B</b></button>
  </div>

    </textarea>

【问题讨论】：

您希望文本仅在用户选择了textarea 时才加粗？像这样？ textarea:focus font-weight: bolder;

不，你不能这样做。对于此功能，您需要所见即所得的编辑器或 contenteditable 元素。

【参考方案1】：

如果您想让文本区域内的文本看起来更粗，您可以使用简单的 CSS 类来实现。

但如果您只想格式化选定的文本（粗体、下划线、链接等），最好使用文本编辑器插件。例如见Redactor、CKEditor等。

【参考方案2】：

你可以使用 ng-class 指令。

<div ng-controller="MyCtrl">
 <textarea ng-class="text_type_bold: isBold">Bob</textarea>
 <button ng-click="makeBold()">bold</button>
</div>

.text_type_bold
  font-style:none;
  font-weight:bold;


var app = angular.module('myApp',[]);
function MyCtrl($scope)    
    $scope.isBold = false;
    $scope.makeBold=function()
        $scope.isBold = !$scope.isBold;
    

见小提琴http://jsfiddle.net/Aejvm/117/

【讨论】：

@Mircae 这给了我我已经拥有的东西。我希望能够在 bob 中选择 b 并只加粗体。谢谢