1

我有一个 ng-repeat，其中第一个项目需要选择类，然后单击每个项目然后更改选择。

<li ng-repeat="ticker in tickers"
    data-ng-class="{'selected':$first}"
    ng-click="selectTicker(ticker.ticker)">{{ticker.ticker}}</li>

^ 这可以让第一个项目selected默认具有类。

<li ng-repeat="ticker in tickers"
    data-ng-click="toggleTicker.item = $index"
    data-ng-class="{'selected':toggleTicker.item == $index}"
    ng-click="selectTicker(ticker.ticker)">{{ticker.ticker}}</li>

^ 感谢这个问题。上面的作品添加了selected基于点击的类，但默认情况下不再选择第一项。

我的问题是如何将两者结合起来？我尝试了以下方法，但没有成功：

data-ng-class="{'selected':$first && toggleObject.item == $index}"

我的控制器：

var vs = $scope;

ApiFactory.getWatchList().then(function(data) {
    vs.tickers = data.data.tickers;
    vs.toggleTicker = {item: -1};
    vs.toggleTicker.item = vs.tickers[0];
    vs.loadingDone = true;
    console.log(vs.tickers[0]);
});
4

2 回答 2

1

这不是在 ng-class 中完成的，而是在控制器或 ng-init 中完成的：

data-ng-init="toggleObject.item = tickers[0]" 
data-ng-class="{'selected':toggleObject.item == $index}"

我仍然建议您在控制器中执行此操作。

于 2015-04-20T22:03:30.803 回答
1

您正在初始化item控制器中索引 0 处的对象，但在其他任何地方它似乎都是一个数字。如果您只想使用索引（因为单击将其设置为数字），请尝试以下操作：

var vs = $scope;

ApiFactory.getWatchList().then(function(data) {
    vs.tickers = data.data.tickers;
    vs.toggleTicker = {item: 0}; // set index 0 as the selected index
    vs.loadingDone = true;
    //console.log(vs.tickers[0]); // what if there are no items?
});

html：

<li ng-repeat="ticker in tickers"
    data-ng-click="toggleTicker.item = $index"
    data-ng-class="{'selected':toggleTicker.item == $index}"
    {{ticker.ticker}}
</li>

使用$first是不好的，因为同一个项目将永远是第一个（除非你重新订购它们）。使用ng-clickanddata-ng-click很糟糕，因为它们本质上是相同的，也许实际上只有一个会被调用？

于 2015-04-20T22:17:26.857 回答