在AngularJS中，在模板内部使用过滤器

Question

我一直在审查bootstrap here的角度指令。特别是typeahead指令。

在提供的示例代码中，出现以下行：

<input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">

叫我注意过滤器：$ viewValue。 $ viewValue的目的是什么？在那里使用美元符号的原因是什么？

感谢。

Answer 1

以$开头的变量是保留的角度变量。请参阅“前缀命名约定”下的https://docs.angularjs.org/tutorial/step_05

  

作为命名约定，Angular的内置服务，Scope方法和   一些其他Angular API在名称前面有一个$前缀。

     

$前缀用于命名空间Angular提供的服务。至   防止冲突最好避免命名您的服务和模型   任何以$开头的东西。

     

如果您检查范围，您可能还会注意到一些属性开始   与$$。这些属性被认为是私有的，不应该是   访问或修改。

更具体地说，$viewValue是用户输入到输入字段中的值。我能找到的所有文件都是：

  

typeahead='sourceExpression' - typeahead的来源，在哪里   sourceExpression可以是一个数组，也可以是解析为一个的promie   阵列。评估时可以使用特殊变量$viewValue   这个表达

来自https://gist.github.com/pkozlowski-opensource/4998969

Answer 2

$viewValue是用户在输入字段中输入的原始输入。在这种情况下，它是一个字符串，因为输入类型是文本。 typeahead属性中发生的事情是您的说法＆＃34;显示状态列表，按用户输入（$viewValue）过滤，限制为8项＆＃34;。这意味着根据用户输入显示最多8个项目。 $只是AngularJS中的惯例 - 他们使用$表示公开可用的功能，$$表示不打算成为公共API的一部分。