javascript - AngularJS - 从无序列表中省略用户

标签 javascript angularjs node.js socket.io angularjs-ng-repeat

我正在尝试使用 Angular.JS 在聊天页面上创建用户列表。我想让用户在列表顶部看到他自己的名字。我想通过以下任一方式来完成此任务:

A) 从列表中省略用户自己的姓名,然后在其他地方打印用户的姓名。

B) 将用户的名字推到无序列表的顶部(您会在列表的顶部看到您自己的名字。)

相关代码如下:

ChatCtrl.js

function ($scope, $log, socket, personService) {
   // ..........
        $scope.person = personService.getPerson();

    // personService is a service which gather info each time a person logs in

        socket.emit('people-join-server', {
            user: $scope.person.name,
            interests: $scope.person.interests
        });     


        socket.on("update-people", function(data) {

            $scope.people = data.people;
            $scope.count = data.count;              
            $scope.$digest();
        });
  // ..........
    }

Socket.js

var _ = require('underscore')._;

// the io argument comes from the root app.js file
module.exports = function (io) {
    var people = {};
    var sockets = [];
    var sizePeople = _.size(people);

    io.sockets.on('connection', function(socket){

        socket.on('people-join-server', function (data) {
            people[socket.id] = {"user": data.user, "interests": data.interests};

            io.sockets.emit('update-people', {people: people, count: sizePeople});
        });
    // ........
    }
};

chat_page.html

 <ul>               
    <li ng-repeat="peeps in people">
        <span>{{peeps.user}}</span>
    </li>
  </ul>

最佳答案

为什么不把 ng-show 放在 li 标签本身上:

    <ul>
        {{person.name}}
        <li ng-repeat="peeps in people" ng-show="peeps.user!=person.name">
            <span>{{peeps.user}}</span>
        </li>
    </ul>

这也许会消除空白问题。

关于javascript - AngularJS - 从无序列表中省略用户,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27191438/

相关文章:

javascript - 使用 yo Angular :factory test fails to load testProvider 创建服务

javascript - ASP.NET Core SignalR 中的客户端生命周期事件

node.js - 从 firestore 获取数据时使用 async forEach 循环

AngularJs - 注入(inject) $scope

javascript - 应用程序可以工作,但其中的第一个 Controller 失败

javascript - Grunt Globbing 模式

node.js - 如何访问预更新 Mongoose 中间件中的文档对象?

javascript - 单击按钮更改 javascript/css 中 <body> 的文本字体大小

javascript - 如何从嵌套集合模型中的对象数组生成嵌套对象数组?

javascript - 如何在所有 $http 请求前加上 http ://localhost:3001?