$ watch（）没有更新$ scope

我有以下控制器，当我调用$scope.remove()它时，它向usercart发出请求，后者向api发出请求。api返回json对象，该对象具有包含购物车商品数组的对象。

页面上的html使用ng-repeat来遍历项目，但是由于某些原因该页面未更新，因此我无法弄清原因。

// Main controller
app.controller('Checkout', function($scope, usercart){

    $scope.cart = [];

    $scope.$watch(function(){
        return usercart.cart;
    }, function(newVal, oldVal){
        if(newVal !== oldVal){
            $scope.cart = newVal;
        }
    }, true);

    $scope.remove = function(domain){
        usercart.remove(domain);
    };

});

该服务向api发出请求并保存购物车数据。

// User cart service
app.service('usercart', function(cart){
    this.remove = function(domain){
        // cart is an api service to make http requests
        cart.removeDomain(domain).success(function(data){
            this.cart = data.cart;
        });
    };
});

这是一个json响应示例：

{
    "message":"Success",
    "cart":[{
        "domain":"asdfsadfsadf.org",
        "years":2,
        "amount":9
    },{
        "domain":"asdsmembers.cc",
        "years":2,
        "amount":24.95
    },{
        "domain":"asdsmembers.tv",
        "years":2,
        "amount":39.95
    }]
}

这是html：

<tr ng-repeat="i in cart">
    <td data-th="Product">
        {{i.domain}}
    </td>
    <td data-th="Price">${{i.amount|number:2}}</td>
    <td data-th="Quantity">
        <select ng-model="i.years" ng-options="y.value as y.name for y in selYears" ng-disable="isInCart(i.domain)" ng-class="{disabled: isInCart(i.domain)}" ng-change="update(i.domain, 'years', i.years)"></select>
    </td>
    <td class="actions" data-th="" align="center">
        <button class="btn btn-default btn-sm" style="background: #333;" ng-click="remove(i.domain)"><span class="glyphicon glyphicon-remove-circle" aria-hidden="true" style="color:#fff;"></span></button>
    </td>
    <td data-th="Subtotal" class="text-center">${{i.years * i.amount|number:2}}</td>
</tr>

同样，在页面加载时，表也可以正常显示。就在我运行删除功能时。