简体   繁体   English

AngularJS刷新似乎不起作用

[英]AngularJS refresh doesn't seem to work

I got a simple 2 sections that I want to be old and new. 我有一个简单的2个部分,我想成为新老成员。 Once new is done and socket is being invoked old = new and new should be empty. 一旦完成new并调用套接字,则old = new,而new应该为空。 The thing is everything keeps still adding into upper (new) section. 关键是,一切仍会添加到上部(新)部分。 The last socket is responsible for managing this. 最后一个套接字负责管理此操作。

Controller : 控制器:

.controller('DepositsCtrl', function ($scope, mySocket) {
        $scope.deposits = [];
        $scope.olddeposits = [];
        $scope.winnerSteamName = "";
        $scope.roundValue = 0;
        $scope.winnerChance = 0;
        $scope.avatarWinner = "";

        mySocket.on('sendDepositIO', function(steamIdIO, itemCountIO, depositValueIO, avatarIO, steamNameIO) {
            $scope.deposits.push({
                steamId: steamIdIO,
                itemCount: itemCountIO,
                depositValue: depositValueIO,
                avatar: avatarIO,
                steamName: steamNameIO
            })
        });

        mySocket.on('newConnection', function (depositsInRound, olddepositsInRound) {
            $scope.deposits = depositsInRound;
            $scope.olddeposits = olddepositsInRound;
        });

        mySocket.on('newRoundDeposit', function () {
            $scope.olddeposits = $scope.deposits;
            $scope.deposits = [];
        });

Html : HTML:

<div ng-controller="DepositsCtrl">
            <h2>Deposits</h2>
            <hr class="line-under">
            <section class="round section">
                <ul>
                    <li class="li-deposit" ng-repeat="deposit in deposits | orderBy:'-'">
                        <div class="deposit-person"><img class="small-avatar" ng-src="{{deposit.avatar}}" /> <span class="name">{{deposit.steamName}}</span> </div>
                        <div class="deposit-items">{{deposit.itemCount}} items</div>
                        <div class="deposit-value">{{deposit.depositValue}}$</div>
                    </li>
                    <li>
                        <hr class="line-under">
                        <h3 class="new-round text-center">New Round  <i class="fa fa-arrow-up fa-lg"></i></h3>
                    </li>
                </ul>
            </section>
            <section class="round section">
                <ul>
                    <li>
                        <div class="text-center center-block">
                            <img class="small-avatar" ng-src="{{avatarWinner}}" /><span>{{winnerSteamName}} has won {{roundValue}} with {{winnerChance}}% chance !</span>
                        </div>
                    </li>
                    <li class="li-deposit" ng-repeat="olddeposit in olddeposits | orderBy:'-'">
                        <div class="deposit-person"><img class="small-avatar" ng-src="{{olddeposit.avatar}}" /> <span class="name">{{olddeposit.steamName}}</span> </div>
                        <div class="deposit-items">{{olddeposit.itemCount}} items</div>
                        <div class="deposit-value">{{olddeposit.depositValue}}$</div>
                    </li>
                    <li>
                        <hr class="line-under">
                        <h3 class="new-round text-center">Previous Round  <i class="fa fa-arrow-up fa-lg"></i></h3>
                    </li>
                </ul>
            </section>
        </div>

Having looked at your code and reading the discussion with Leandro I am wondering. 看完您的代码并阅读了与Leandro的讨论后,我想知道。

Are you really sure that 'newRoundDeposit' is emitted and catched? 您真的确定发出并捕获了“ newRoundDeposit”吗?

Sorry if this is a silly question, but for me, your coding looks correct. 抱歉,这是一个愚蠢的问题,但是对我来说,您的编码看起来正确。

Arrays are objects and objects are assigned by reference, so when you do $scope.olddeposits = $scope.deposits, you are assigning the reference stored in deposits to olddeposits. 数组是对象,对象是通过引用分配的,因此当您执行$ scope.olddeposits = $ scope.deposits时,会将存储在存储中的引用分配给olddeposits。

Try $scope.olddeposits = angular.copy($scope.deposits); 尝试$scope.olddeposits = angular.copy($scope.deposits); and see what happens. 看看会发生什么。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM