0

タブ (お気に入りの項目) を使用してブール値でフィルター処理されたコレクションを表示する ng-repeat があります。私は持っている：

すべてのアイテム | お気に入り

  • 項目 1
  • 項目 2
  • 項目 3

最初に (json を使用して) サーバーからコレクションをロードすると、タブは正常に機能し、コレクションがフィルター処理されます。アイテムをクリックすると、アイテムのお気に入りのプロパティが更新されますが、フィルターが更新されず、タブをクリックしてもデータが更新されないようです。

コード：

HTML:

<button class="btn" ng-model="section" value="all-items" ng-click="filterCriteria={};   activate('all-items')" ng-class="{disabled: products.length == 0, active: section == 'all-items'}">All items ({{products.length}})</button>

<button class="btn" ng-model="section" value="favourites" ng-click="activate('favourites'); filterCriteria.Favourite = true;" ng-class="{disabled: (products | filter: {Favourite:true}).length < 0, active: section == 'favourites'}">Favourites</button>

<!-- List of products -->
<ul>
    <li ng-repeat="product in products | filter: filterCriteria">
        <button class="btn" type="button" ng-click="favouriteClick(product)">Favourite</button>
        <p>{{product.description}}</p>
    </li>
</ul>

コントローラ

app.controller('ProductListCtrl', ['$scope', '$http', function ($scope, $http, $filter)     {

    $http.get('/Products').success(function (data) {
        $scope.products = data;
    });

    $scope.filterCriteria = {};
    $scope.section = "all-items";

    $scope.activate = function (option) {
        $scope.section = option;
    };

    $scope.favouriteClick = function (product) {

        product.favourite = !product.favourite;

        // Sync with back-end
        $http({
            method: 'POST',
            url: '/SetFavourite',
            data: 'name=' + product.Sku + '&value=' + product.favourite,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        });
    };
} ]);

どんなフィードバックでも大歓迎です。ありがとう

編集

ソリューションhttp://jsfiddle.net/njrHm/でフィドルを作成しました

4

1 に答える 1

0

筐体の問題です。あなたが持っている：

ng-click="activate('favourites'); filterCriteria.Favourite = true;"

...そして、次のようになります。

product.favourite = !product.favourite;

ngClick小文字を使用するように変更したいと思いますfavourite。

于 2013-05-09T19:02:16.710 に答える