AngularJS: newline characters to paragraph elements

angularjs, javascript

Solution

The best solution I could think of was to create a filter:

angular.module('myApp').
filter('nlToArray', function() {
  return function(text) {
      return text.split('\n');
  };
});

This takes a block of text and creates a new array element for each paragraph.

This array can then be plugged into an ng-repeat directive:

<p ng-repeat="paragraph in textBlock|nlToArray track by $index">{{paragraph}}</p>

Problem

Within Angular, I need to generate a series of paragraph elements from a block of text containing newline characters? I can think of a couple of ways to do this. However I am wondering whether there is an "official" Angular way or just what the most elegant approach would be within the AngularJS context. An Example From: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. \n Sed diam nonummy nibh euismod tincidunt ut laoreet dolore. \n Magna aliquam erat volutpat. Ut wisi enim ad minim veniam. to: ``` <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p> <p>Sed diam nonummy nibh euismod tincidunt ut laoreet dolore.</p> <p>Magna aliquam erat volutpat. Ut wisi enim ad minim veniam.</p> ``` I can think of a number of ways to do this: - Modify the text in the controller (though I prefer to avoid modifying my models) - Using a directive, and generating paragraphs in a link function (seems overly cumbersome). - Using a filter (my current favourite) to create an array to pipe into ng-repeat

Original source