2

ソートされていないアイテムのリストがあり、orderBy名前の英数字でソートするために使用します。

<li class="ticker-li"
    ng-repeat="ticker in tickers | orderBy:'ticker'"
    ng-class="{'selected':ticker.selected}">

    <div class="ticker"
         ng-click="unselectAll(); ticker.selected = !ticker.selected;
         selectTicker(ticker);
         revealTickerOptions()">
         {{ticker.ticker}}
    </div>

今私のコントローラでは、これは私が現在選択された最初のアイテムのクラスをどのように設定しているかです:

var vs = $scope;
vs.tickers = data;
vs.tickers[0].selected = true;

orderBy^アイテムがアルファ順に表示されるように を追加する必要があるまで、これは完全に機能しました。

ここに画像の説明を入力

この回答はこちらで見つかりましたが、最初のアイテムが常にクラスを持つようにロックされます。

私のコードを少し変更して、他のボタンをクリックするとそのクラスを取得することができましたが、$firstアイテムはまだクラスにとどまりました。

ng-class="{'selected':$first || ticker.selected}"

私のコントローラーでは、これは私のunselectAll関数であり、次のようには機能しません'selected':$first:

vs.unselectAll = function() {
    for (var i = 0; i < vs.tickers.length; i++) {
        vs.tickers[i].selected = false;
    }
};

ここに画像の説明を入力

この問題を修正するには、マークアップまたはコントローラーのコードをどのように更新する必要がありますか?

4

1 に答える 1

2

これを試してみてください。並べ替えで $index を読み取る方法がわかりませんが、 $first を取り除き、この init ステートメントをそこに入れます。

<li class="ticker-li"
    ng-repeat="ticker in tickers | orderBy:'ticker'" 
    ng-init="$index ? ticker.selected = false : ticker.selected = true"
    ng-class="{'selected':ticker.selected}" ng-click="unselectFirst($index)">

これはハックかどうかのグレーゾーンだと思います.ng-initで技術的にプロパティをエイリアスしていませんが、紙一重だと思います. 他の解決策は、コントローラーで配列をソートすることです。ドキュメントには、アルファベット順にソートする例があります https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array /選別

于 2015-05-06T03:04:00.960 に答える