javascript - 在视图中使用正则表达式

Question

我有一个这样的控制器：

function Ctrl( $scope ){

    $scope.str = " Misty Mountain Hop ";

}

像这样的视图：

<div ng-controller="Ctrl">

    <p>{{ str }}</p>       <!-- This one is ok -->
    <p>{{ str.split( "Mountain")[0] }}</p>   <!--Even this one is fine too -->
    <p>{{ str.replace( /Mountain/ , "Plain" ) }}</p>  <!-- This one is bad -->

</div>

因此，如果我尝试使用一种replace方法，则会出现错误：

Syntax Error: Token 'Mountain' is unexpected ... 

http://jsfiddle.net/H3ztj/

问题是：为什么？

Answer 1

由于您的问题是“为什么？”，答案是插值块中的表达式不是 JavaScript 表达式，而是Angular 表达式。它们看起来很像 JavaScript（故意），但 Angular 使用自己的解析器来解析代码。

这样，它可以做的不仅仅是评估一次表达式：它还可以做一些事情，比如分析依赖关系，所以它可以观察成分并在这些成分发生变化时进行更新。它还可以评估相对于 , 的表达式$scope，以便{{foo}}返回$scope.foo而不是调用的全局变量foo（这反过来使诸如 ngRepeat 之类的事情起作用）。

当 Angular 团队实现 Angular 表达式时，他们显然没有实现正则表达式。这并不奇怪——这种代码无论如何都应该在您的控制器中，您可以在其中对其进行测试。