过滤

app.filter('status', function() {
    return function(input, theStatus) {
        var out = [];

        for (var i = 0; i < input.length; i++) {
            var widget = input[i];
            if (widget.status === theStatus)
                out.push(widget);
        }

        return out;
    };
});

过滤器原样应用于ng-repeat。

<tr ng-repeat="widget in pendingWidgets = (widgetList | status: 0)">
    <td><a href="" ng-click="updateStatus(widget.widgetId, 1)"><span class="glyphicon glyphicon-usd" /></a></td>
    <td><a href="" ng-click="updateStatus(widget.widgetId, 2)"><span class="glyphicon glyphicon-usd" /></a></td>
    <td><a href="" ng-click="updateStatus(widget.widgetId, 3)"><span class="glyphicon glyphicon-usd" /></a></td>
    <td><a href="" ng-click="updateStatus(widget.widgetId, 4)"><span class="glyphicon glyphicon-usd" /></a></td>
</tr>

在面板标题上如此

<div class="panel-heading"><span class="badge">{{pendingWidgets.length}}</span></div>

点击字形后ng-click运行updateStatus()，如下所示......

$scope.updateStatus = function(theId, newStatus) {
    widgets.setStatus(tagNumber, newStatus);
    $scope.displayAlert = true;
};

而widget.setStatus()就是这样......

app.factory('widgets', ['$http', function($http) {
    var o = {
        widgets:[]
    };

    o.setStatus = function(aWidget, theStatus) {
        return $http.put('/widgets/' + aWidget, { 'status': theStatus }).success(function (data) {
            // do I need to put something here?
        });
    };

    return o;
}]);

我的问题在于

当对我的模型进行updateStatus（）调用时，如何让我的页面在ng-click操作上刷新？单击字形时，模型会更新，但页面不会更新。仅在页面刷新时或当我访问其他页面然后返回时，页面会相对于自定义过滤器准确显示更新的模型。

Answer 1

它看起来不像您正在更新特定小部件的状态（在客户端）。您告诉服务器有关更新的信息，但在客户端，没有更新。

这就是为什么当你刷新（我想你正在从db / backend加载小部件）时，你会看到更新。

您拥有：// do I need to put something here?，您需要执行以下操作：

aWidget.status = data.status; // where data is the updated widget object

（这假设您的后端正在返回更新的小部件 - 如果您遵循我习惯的相同约定 - 应该是这样）。

角度更新模型，但没有自定义过滤器的双向绑定

过滤

1 个答案: