1

AngularJS で Foundations を使用しています。を使用して列に表示しようとしている場合がありますng-repeat

<div class="four columns" ng-repeat="resultsObject in resultsObject">
    <div ng-bind-html-unsafe="resultsObject"></div>
</div>

これはうまくいきます。しかし問題は、列のサイズが 1 ~ 5 の範囲になる可能性があることです。そして、ディスプレイを動的に更新したいと思います。したがって、列が 2 つしかない場合は、正しい列表示に調整されます。

<div class="{{$rootScope.columnCount}} columns" ng-repeat="resultsObject in resultsObject">
    <div ng-bind-html-unsafe="resultsObject"></div>
</div>

上記のコードのようなことをしようとすると、{{$rootScope.columnCount}}何も表示されません。(入力に基づいて正しい列が正確に格納されることを確認しました。) ソースでは<div class=" columns">ではなくとして表示され<div class="3 columns">ます。

これは角度変数の使用とng-repeat属性の問題ですか? クラス内で使用{{$index}}したので、クラス属性内で出力できることがわかりました。

4

2 に答える 2

1

いくつかのコードを見なければ、列の数が等しいと仮定するresultsObject.lengthので、試してみてください:

<div class="{{resultsObject.length}} columns" ...

ここに短いデモがあります。各 li のクラスをチェックすると、カウントが表示されます。

http://plnkr.co/edit/fFRTjD5gse8tnJmDig2I?p=preview

最後にclass="{{columnCount}} columns">... 、$rootScope を参照する必要はないと思います。

于 2013-05-06T18:44:45.170 に答える