Angular [$interpolate:interr] error for applied filter

Question

Hi I have a filter which replaces \n to \n\n when i use this filter for my json data I get error saying Can't interpolate: {{ post.description|nlToArray }} TypeError: Cannot read property 'replace' of undefined

My filter

sampleApp.filter('nlToArray', function() {
  return function(text) {
      return text.replace(/\n/g, '/\n\n');
  };
});

displaying data obtained from json api

hmtl

<p class="blog-post-title">{{ post.title }}</p>
<p class="blog-post-meta"><i class="fa fa-clock-o">&nbsp {{ post.pub_date|date  }}</i> </p>
<span style="white-space: pre-line">{{ post.description|nlToArray }}</span>
<br />

My json data

[{"id":1,"title":"Israel’s desert city of Beersheba is turning into a cybertech oasis","description":"morphing into a tech oasis.\r\nThe military’s massive relocation of its prestigious technology units.\r\nBeersheba has all of the ingredients of a vibrant security technology ecosystem, \r\n“All in all, projections are that 20,000-30,000 \r\nThe commercial sector has teamed up  cyber attacks.","pub_date":"2016-03-20T10:48:19.394643Z"},{"id":2,"title":"These are testing times: mavericks vs. ice people","description":"One of my earliest engineering jobs, before I fled hardware in favor of the (relative). \r\nThe practice of engineering soon teaches one that, .\r\nSo what do we do? We practice defense in depth. We follow the robustness principle. We “always code as \r\n…Yeah, well, that’s the idea. For my day job at HappyFunCorp I do a lot of interviews, and almost every junior develope.\r\nI don’t necessarily blame them. You can make  go.","pub_date":"2016-03-20T10:50:07.965930Z"}]

To be much clearer, description in json is like this

morphing into a tech oasis.\r\nThe military’s massive relocation of its prestigious technology units.\r\nBeersheba has all of the ingredients of a vibrant security technology ecosystem, \r\n“All in all, projections are that 20,000-30,000 \r\nThe commercial sector has teamed up  cyber attacks.

What could be the possible solution...Thanks in advance

Answer 1

Make the code null safe by replacing

sampleApp.filter('nlToArray', function() {
  return function(text) {
      return text.replace(/\n/g, '/\n\n');
  };
});

with

sampleApp.filter('nlToArray', function() {
  return function(text) {
      if (text) 
        return text.replace(/\n/g, '/\n\n');
      else
        return text;
  };
});