2016-03-30 16 views
0

クリックしたときに各オブジェクトを配列にプッシュしたいと思います。個々のオブジェクトの参照を取得することはできますが、オブジェクトを配列にプッシュすることはできません。それはプッシュが機能ではないことを私に伝えます。私はこれを理解しようと多くの時間を費やしました。誰かが私を正しい方向に向けることができますか?参照オブジェクトを配列にプッシュする方法はありますか?

angular.module('app', []); 
 

 
angular.module('app').controller("MainController", function() { 
 
    var vm = this; 
 
    vm.ordered = {}; 
 

 
    vm.menu = [{ 
 
    title: 'Pizza', 
 
    type: 'entree', 
 
    favorite: true, 
 
    price: 10 
 
    }, { 
 
    title: 'Tacos', 
 
    type: 'entree', 
 
    favorite: false, 
 
    price: 5 
 
    }, { 
 
    title: 'Onion Rings', 
 
    type: 'app', 
 
    favorite: false, 
 
    price: 2 
 
    }, { 
 
    title: 'Ice Cream', 
 
    type: 'dessert', 
 
    favorite: false, 
 
    price: 11 
 
    }, { 
 
    title: 'Mac n Cheese', 
 
    type: 'app', 
 
    favorite: false, 
 
    price: 7 
 
    }, { 
 
    title: 'Salad', 
 
    type: 'salad', 
 
    favorite: true, 
 
    price: 4 
 
    }]; 
 

 
}).directive('section', function() { 
 
    return { 
 
    restrict: 'E', 
 
    link: function(scope, element) { 
 
     scope.ordered = {}; 
 
     element.bind('click', function(event) { 
 
     console.log(scope.item); 
 
     scope.ordered.push(scope.item); 
 
     }); 
 

 
    } 
 
    }; 
 
});;
.left { 
 

 
    float: left; 
 

 
    width: 50%; 
 

 
} 
 

 
.right { 
 

 
    float: left; 
 

 
    width: 50%; 
 

 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="app" ng-controller="MainController as main"> 
 

 
    <div class="left"> 
 
    <h2>Lists One</h2> 
 
    <section id="{{item.id}}" ng-repeat="item in main.menu | filter:main.searchInput | orderBy:main.order.key:main.order.reverse"> 
 

 
     <strong>{{item.title}} </strong> 
 
     <span>$ {{item.price}}</span> 
 

 
    </section> 
 
    </div> 
 

 
    <div class="right"> 
 
    <h2>Lists Two</h2> 
 
    <section id="{{item.id}}" ng-repeat="item in main.ordered | filter:main.searchInput | orderBy:main.order.key:main.order.reverse"> 
 

 
     <strong>{{item.title}} </strong> 
 
     <span>$ {{item.price}}</span> 
 

 
    </section> 
 
    </div>

+1

に '$ scope.ordered = {}は' '$ scope.ordered = []' – Jaydo

+1

なぜそのためにディレクティブを使用すべきですか?再利用は不可能で、必要なのはセクションをクリックするだけです。 –

+0

ありがとうございますが、まだ$ scope.orderedはビューに表示されていません – Rafael

答えて

2

変更scope.ordered = {};scope.ordered = [];

+0

scope.orderedがDOMに表示されないのはなぜですか? – Rafael

関連する問題