4

これは、アプリケーションの設計方法に問題がある可能性がありますが、items配列を介してdom要素にアクセスできる必要性に直面し続けています。

$scope.items = [{"src": src, "url": url, "title": title, "top": 0, "left": -500 }];

htmlにバインド:

<div class="block" ty-stacked-block ng-repeat="item in items" ng-style="{ 'top' : item.top+'px', 'left' : item.left+'px' }">
  <a href="{{ item.url }}" title="{{ item.title }}">
    <img ng-src="{{ item.src }}" alt="{{ item.title }}" />
  </a>
  <br />
  <p>{{ item.title }}</p>
</div>

基本的に、$ scope.itemsを実行して、divの位置を(各divの高さに基づいて)変更したい別のコードがあります。

    scope.repositionItems = function() {
        _.each(scope.items, function(item) {
            // TODO get item's height somehow
        });
    };
4

2 に答える 2

4

div "item-{{$ index}}"にIDを追加したので、ループからidで取得できました。あまり「角張った」感じはしませんが、うまくいきました!

<div id="item-{{ $index }}" class="block" ty-stacked-block ng-repeat="item in items" ng-style="{ 'top' : item.top+'px', 'left' : item.left+'px' }">
  <a href="{{ item.url }}" title="{{ item.title }}">
    <img ng-src="{{ item.src }}" alt="{{ item.title }}" />
  </a>
  <br />
  <p>{{ item.title }}</p>
</div>
于 2012-08-22T03:21:18.963 に答える
0

アイテムリストにレイアウト属性がある理由がわかりません。正当な理由がないことを願っています。これが役立つでしょう。複数の要素ブロックを積み重ねて、それぞれにアイテムの結果を含める場合は、アイテムを角度で繰り返して、自分で配置しないようにする必要があります。class ='block'のスタイル属性は、目的の間隔とレイアウトを作成する必要があります。コードを順序付けられていないリストにラップし、divタグをliタグに変更しました。liタグ内のdivはいつでも保持できます。ulでラップしたくない場合は、class = "block"にfloat:leftを適用します。

    <ul>
    <li class="block" ng-repeat="item in items">
      <a href="{{ item.url }}" title="{{ item.title }}">
       <img ng-src="{{ item.src }}" alt="{{ item.title }}" />
      </a>
      <br />
      <p>{{ item.title }}</p>
    </li>
    </ul>

.block {
    background-color:#fff;
    width:400px;
    padding:10px;
    border-radius:8px;
    margin:10px;
    position: relative;
}
于 2013-05-25T00:18:37.283 に答える