Question

我开发了一个存储一些数据和登录的Django应用程序，一旦登录，用户就会与Django中的Angular应用程序进行交互。在我的本地机器上，一切正常。在Heroku托管的应用程序上，一切正常，除了一个奇怪的事情。有一个特定的ng-repeat正在混合值。应该在“index”上显示的所有内容都显示在“index-1”上。这不会发生在我的本地托管应用程序上，它发生在我试过的每个浏览器的Heroku端。这是我的控制器文件中的相关代码：

sc.getMembers = function() {
    //get the list of members
    sc.editMemberPanel = [];
    sc.notTheOwner = [];
    sc.kickOutConfirmPanel = [];
    var members = mf.query({'id': sc.$storage.id},function(data){
        sc.$storage.members = [];
        for(i=0;i<members.length;i++){
            sc.$storage.members.push({
                name: members[i].fields.name,
                role: members[i].fields.role,
                phone: members[i].fields.phone,
                email: members[i].fields.email,
                status: members[i].fields.status,
                pk: members[i].pk
            });
            sc.editMemberPanel[i] = false;
            sc.kickOutConfirmPanel[i] = false;
            //if you own the band, you shouldnt be able to change your own status or email (or kick yourself out!).
            if(sc.$storage.yourUsername != members[i].fields.userName){
                sc.notTheOwner[i] = true;
            } else {
                sc.notTheOwner[i] = false;
            }
        }

    });
}
sc.getMembers();

请注意我也将$ scope注入'sc'。以下是视图文件中的相关代码：

<div class="panel panel-info" data-ng-repeat="(index, member) in $storage.members | orderBy: 'status'">
    <div class="panel-header" style="padding:10px;">
        <strong>{{member.name}}</strong>
    </div>
    <div class="panel-body">
        <div data-ng-hide="editMemberPanel[index]">
            <table class="table">
                <tr>
                    <td>Role</td>
                    <td>{{member.role}}</td>
                </tr>
            ...
            <button data-ng-show="$storage.isManager && notTheOwner[index]" class="btn btn-danger btn-sm" data-ng-click="kickOutConfirm(index, true)"><span class="glyphicon glyphicon-ban-circle"></span> Kick out member</button>
        </div>
        <form class="form-horizontal" role="form" name="editMemberForm" data-ng-show="editMemberPanel[index]">
            <div class="form-group col-xs-12">
                <label for="name" class="col-sm-2 control-label">Name</label>
                <div class="col-sm-10">
                    <input type="text" name="name" class="form-control" placeholder="E.g. Margaret Thrasher" data-ng-model="editMember.name" required /><br />
                </div>
            </div>
...

有两个按钮（踢出成员和编辑成员）。它们仅在某种情况下显示。现在，奇怪的是，当你点击它们时，它们会在正确的索引上执行函数，所以我知道“index”变量是正确的。但按钮显示在错误的成员下。每个人都在“索引 - 第1”成员。但是，它们显示在正确的位置，所以就好像Angular正在使用现有按钮并以某种方式推动它们。所有的div都是平衡的。我省略了几行代码（包括编辑成员按钮）。为什么Heroku混合按钮？哦，值得注意的是，在基本的html文件中，我从源代码中包含了Angular JS。（http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.js）

Answer 1

我的问题是我在显示项目之前迭代项目并添加＆＃34;显示或隐藏＆＃34;变量。然后，这些项目在页面上以不同的顺序显示。迭代按插入日期进行，页面上的显示按字母顺序排列。通过在迭代中明确声明每个项目的索引，并按索引顺序显示它们，我能够解决这个奇怪的问题。我希望这有助于其他人。

Ng-Repeat在Heroku上显示错误的值

1 个答案: