非常に珍しい問題が発生しており、問題がどこにあるのか完全にはわかりません。
ng-repeatこんな感じの電話がかかってきました
.data.row.vote-entry{ "ng-repeat" => "option in agendaItem.conclusions"}
.cast-vote
%a{:href => "#", "ng-click" => "voteForConclusion(option)", "ng-class" => "{active: option.id == votedConclusion.id}"}
=image_tag "icons/icon-conclude.png"
.title
%span {{option.description}}
とてもシンプルで完璧に機能します。
.data.row.vote-entry今、要素ごとに、css ルールがあります
margin-left: 4%;
行が左側からオフセットされるように適用されます。の最初のアイテムに対しては完全に機能しng-repeatますが、ループに複数のアイテムがある場合に問題が発生します。ページが読み込まれると、最初の項目は正しい場所にありますが、CSS ルールを完全に無視したかのように、他の項目はすべて左端にあります。
ロード後すぐに所定の位置に跳ね返ることもありますが、そのままの場所にとどまる場合もあります。firebug のようなものでページを検査すると、CSS ルールはすべて整っています。奇妙なことに、マージン ルールを無効にしてから再度有効にすると、すべて正しい場所に移動するので、本当に混乱しています。なぜこれが起こっているのか。
私は本当に困惑しているので、誰かがここで何が起こっているのかについての手がかりを教えてもらえますか!
これは、問題の一部を示すjsFiddleです。残念ながら、バーが左に離れすぎていることを示しているわけではありません (それを完全に再現することはできませんでした)。