Question

我可以按输入字段对列表进行排序，以便用户显示目标。但是我无法通过点击用户列表中的名称来完成同样的事情。

在输入字段中输入学生姓名可以正常工作。

    <div id="goalcontent">
        <ul id="listheader">
            <li>
                <p>Student Name: <input data-ng-model="username"></p>
            </li>
        </ul>
        <ul class="goals">
            <li class="{{goal.status}}" ng-repeat="goal in goals | filter:username" >
                <span class="goaldeadline">{{goal.username}}</span>
                <span class="goaltitle">{{goal.goal}}</span>
            </li>
        </ul>
    </div>

这是我的用户ng-repeat。 ng-click用于在单击的li上设置类。这很好。我也能够在点击上捕获用户名并进入setSelected函数。类更改很好，但是我无法获得用户名来对列表进行排序。我确定这是一个范围的事情，但我无处可去。

    <div id="usercontent">
        <ul class="users">
            <li  ng-repeat="user in users"  ng-click="setSelected(this)" class={{selected}}><span>{{user.firstname}} {{user.lastname}}</span></li>
        </ul>
    </div>

这是我的setSelected函数。

$scope.setSelected = function (username) {
    var lastSelected = ''
    if ($scope.lastSelected) {
        $scope.lastSelected.selected = '';
    }
    this.selected = 'selected';
    $scope.lastSelected = this;
    username = (this.user.username);
    console.log(username);
};

控制台正确显示我的用户名。但是我所尝试过的任何东西都无法用它来排列目标列表。

Answer 1

不使用setSelected函数，我将这样做:(假设用户名和用户在同一$范围内）

<div id="usercontent">
        <ul class="users">
            <li  ng-repeat="user in users"  ng-click="username = user.username" ng-class="{selected: (username == user.username)}"><span>{{user.firstname}} {{user.lastname}}</span</li>
        </ul>
 </div>

1-使用ng-class，您可以有条件地添加“已选择”类

2-使用ng-click将用户名设置为所选用户。它会改变您的输入文本，并将由您的ng-repeat过滤器使用。

希望我能理解你想知道的事情。我对你的setSelected函数感到有点困惑。通常我不会在控制器中使用'this'而我之前没有真正看到过。

角度范围混合;尝试通过单击另一个列表中的项目来排序列表

1 个答案: