2016-04-07 5 views
1


最近遭遇しました。
2つのdivに配列の要素をAngularで表示する方法は?

a= ['apple', 'rice','pasta','orange'] 

後のDBに保存するために、この配列にランダムなものをプッシュするボタンは、例があります:
私は、文字列のいずれかの配列を持って、それを表示する方法

a.push('carrot');a.save() 

DOMは2つの別々の部門に分かれています(リンゴ、左側のオレンジ、右側のパスタ、スプリットは静的で、世界のすべての果物を認識するために角度を教える必要はありません:P)。

私の考えでは、フィルターをかけたり、2つの変数に分割して後で元に戻したりできますか?

var a = getFromDb 
$scope.b = _.filter(a,isFruit) 
$scope.c = _.filter(a,isNotFruit) 

Fruits : <div ng-repeat=fruit in b> {{fruit}}</div> 
Others : <div ng-repeat=notFruit in c> {{notFruit}}</div> 

$scope.save = function() { 
    var a = $scope.b + $scope.c 
    saveToDb(a) 
} 

誰かがもっと派手な方法を持っていた場合、私は大好きだので、それは非常に醜い: 私の(汚い)ソリューションでしたか?あなたはスコープ(またはコントローラなどで)に定義することを提供する

答えて

1

$scope.a = ['apple', 'rice', 'pasta', 'orange'] 

次にテンプレートであなたは、単にaを2つの部分を分割することができますし、それらを別々に使用します。

<div class="left"> 
    <span ng-repeat="fruit in a.slice(0, 2)">{{ fruit }}</span> 
</div> 

<div class="right"> 
    <span ng-repeat="fruit in a.slice(2)">{{ fruit }}</span> 
</div> 
+0

少しですあなたの答えを少し強くしてください。これはリンゴ、米を左に、パスタを右に置く。 –