使用自定义过滤器时 ng-bind 失败答案

【问题标题】：ng-bind failing when using a custom filter使用自定义过滤器时 ng-bind 失败
【发布时间】：2015-12-07 14:26:10
【问题描述】：

我查看了许多回复，但终生无法弄清楚为什么我的代码无法正常工作！

我想对从控制器传递的变量应用一个简单的自定义过滤器。 room-price 值显示正常。但是，当我添加 price-per-night 过滤器时，该值消失了。

谁能提出解决方案？谢谢

模板

<div class="h3 left-align p1" ng-bind="room.price | price-per-night"></div>

控制器

routerApp.controller('MyController', function($scope) {
    $scope.rooms = [
    {
        name: 'Basic',
        price: 50
    }]
});

过滤器

routerApp.filter("price-per-night",
    function() {
        return function(price) {
            var output = '£' + price + ' ' + 'per night';
            return output;
        };
    }
);

【问题讨论】：

标签： javascript angularjs filter ng-bind

【解决方案1】：

将您的过滤器命名为pricePerNight。名称中不允许有-：

routerApp.filter("pricePerNight",
    function() {
        return function(price) {
            var output = '£' + price + ' ' + 'per night';
            return output;
        };
    }
);

（您仍然在 HTML 中使用 price-per-night）

【讨论】：