Question: I'd like to automatically add a new line break every 10 characters with this code :

HTML :

```
<div ng-app="">
  <textarea id="chat" ng-model="msg"></textarea>
  <span class="msg" ng-bind="msg"></span>
</div>

```

Naturally when I type something in the textarea, it appears below in the span. But I want it to work like there is a line break every 10 characters.

I've tried :

JQuery :

```
var n = $('#chat').val().length;
if (n%10 == 0 && n > 0) {
  $('.msg').append('<br>');
}

```

and many other things like replacing < br > with '\n', .append with .appendTo, but whatever I try, the text that appears in the span is just in one line. I also tried solutions I found on this website, like styling the span with "white-space:pre;" or using < pre >... < /pre >. I'd like to mention that I'm a total newbie with AngularJS.

Answer: 
`If` is not gonna work, you have loop through the text like this

```
   $("#chat").keyup(function(){
     var msg = $(this).val();
     var span_msg='';
     for(var i=0; i<msg.length; i++)
      span_msg+=msg[i]+(i==10?"<br>":"");
     $('.msg').html(span_msg);
    });

```
Angular way:

**Filter:**

```
app.filter('addBr', function($sce){

    return function(input, length) {

        return $sce.trustAsHtml(input.match(new RegExp(".{1," + length + "}", 'g')).join("<br/>"));

    };
});

```

**Controller:**

```
$scope.test = "Professional lorem ipsum generator for typographers";

```

**View:**

```
<div ng-bind-html="test | addBr: 20"> </div>

```

I hope this will work, for me it does.