AngularJS 简单过滤器示例

示例

过滤器格式化表达式的值以显示给用户。它们可以在视图模板，控制器或服务中使用。本示例创建一个过滤器（addZ），然后在视图中使用它。此过滤器所做的全部工作是在字符串的末尾添加大写字母“ Z”。

example.js

angular.module('main', [])
    .filter('addZ', function() {
            return function(value) {
                return value + "Z";
            }
     })
    .controller('MyController', ['$scope', function($scope) {
        $scope.sample = "hello";
    }])

example.html

在视图内部，过滤器采用以下语法：{ variable | filter}。在这种情况下，我们在控制器中定义的变量sample将被创建的过滤器过滤addZ。

<div ng-controller="MyController">
   <span>{{sample | addZ}}</span>
</div>

预期产量

helloZ