Question

我写了一个看起来工作正常的过滤器，虽然我收到以下错误。

TypeError: Cannot read property 'replaceAll' of undefined

过滤器用绝对的url替换错误的相对URL。这是过滤器和标记。

//located elsewhere
String.prototype.replaceAll = function(s,r){
    return this.split(s).join(r);
}
//located elsewhere
var imgBase = '<img src="http://discourse.mysite.com';

app.filter('prependImg_topic', function(){
  return function(cooked) {
    return cooked.replaceAll('<img src="//discourse.mysite.com', imgBase);
  }
})

标记：

<div class="topic-post-body" ng-bind-html="topic.post_stream.posts[0].cooked | prependImg_topic "></div> "

我倾向于使用$sce因为我在ng-bind-html输入数据。如果我打印这样的值：{{topic.post_stream.posts[0].cooked}}，它就存在，所以我知道它没有未定义。此外，过滤器工作并正确写入URL。去搞清楚。

我可以提供帮助解答所需的任何其他详细信息。感谢。

编辑：另一个可能有用的奇怪之处是ng-repeat这个过滤器内部有效，并且不会抛出任何错误。有趣的东西！

<div class="post" ng-repeat="post in posts" ng-if="$index > 0">
     <div class="topic-post-body" ng-bind-html="post.cooked | prependImg_topic"></div>
</div>

Answer 1

我猜数据是异步加载的，如果是这样的话，毫无疑问过滤器会抛出错误，因为它试图操作（尚未）不存在的数据。您进行的检查{{ topic ... }}没有任何证据，因为如果最终会有数据，它会打印数据（更好地检查console.log）。 ng-repeat内的过滤器没有抛出任何错误的原因是ng-repeat仅在有任何数据要迭代时才起作用，这意味着当ng-repeat内的过滤器运行时数据已经存在。这也是为什么你应该总是构造过滤器的原因，它们可以处理undefined或null值，而不会抛出。

角度过滤器有效，但将输入视为未定义并抛出错误

1 个答案: