AngularJS过滤不带ng-repeat的对象的单个属性

Question

我需要有关AngularJS过滤器的帮助。..（Angularjs 1.2.7）

这是我的问题：

我有一个这样的班级用户。

Public Class User
    Public Property UserID As Integer
    Public Property EMail As String
    Public Property Password As String
    Public Property Firstname As String
    Public Property Lastname As String
    Public Property Creator As Integer
    Public Property LastEditedBy As Integer
    Public Property Company As Company
End Class

和这样的公司类别：

Public Class Company
    Public Property CompanyID As Integer
    Public Property Name As String
    Public Property RegistrationDate As String
    Public Property Creator As Integer
    Public Property LastEditDate As String
    Public Property LastEditedBy As Integer
    <ScriptIgnore>
    Public Property Users As List(Of User)
    Public Property Companytype As Companytype
    <ScriptIgnore>
    Public Property PriceLists As List(Of CompanyPriceList)
End Class

好吧，现在集中讨论我公司或用户类别中的2个属性（Creator和LastEditedBy）。 我想在单个公司视图中获得公司创建者和编辑者的名字和姓氏。

有了这个：

companyManagement.getCompany = function (companyId) {
    var cmp = $filter('getCmpById')(companyId);
    return cmp;
};

我得到了整个公司，并用这两个整数作为对象。现在，在我的GUI中，我想显示属于此ID的用户的名字和姓氏。

app.filter('getUsrById', function (userManagement) {
var users = userManagement.getUsers();
return function (list) {
    var i = 0, len = users.length;
    for (; i < len; i++) {
        //convert both ids to numbers to be sure
        if (+users[i].UserID == +list) {
            return users[i];
        }
    }
    return "not found";
};

}）;

使用此过滤器，我得到了属于id的整个用户对象。 现在有什么方法可以显示用户的两个属性吗？ 像这样

 <span data-ng-model="creatorFirstname">{{ user.firstname | getUsrById:{userId:singleCompany.Creator} }}</span>
 <span data-ng-model="creatorLastname">{{ user.lastname | getUsrById:{userId:singleCompany.Creator} }}</span>
 <span data-ng-model="editorFirstname">{{ user.firstname | getUsrById:{userId:singleCompany.LastEditedBy} }}</span>
 <span data-ng-model="editorLastname">{{ user.lastname | getUsrById:{userId:singleCompany.LastEditedBy} }}</span>

我不想将Properties声明为User，因为我在两个类中都拥有它们，并且我希望保持一致性。 不在User-> Integer和Company-> As User中，所以我可以忽略它们并将旧数据发送回服务器，因为LastEditedBy属性始终被它覆盖，而Creator属性始终保持不变。

谢谢你的帮助！

Answer 1

不确定筛选器是否是执行此处所需操作的正确机制。 我认为，最自然的编码方式是在您的范围内具有company ， lastEditedBy和creator属性，并确定哪些用户是您感兴趣的用户并将其添加到您的公司模型中。

检索公司后，在成功处理程序中添加几行（此处使用下划线js来获取用户

$scope.lastEditedBy = _.findWhere( $company.users, { UserID : $company.LastEditedBy } );
$scope.creator = _.findWhere( $company.users, { UserID : $company.Creator } );

然后，您只需要引用lastEditedBy和creator所需的任何属性：

<span>{{lastEditedBy.firstname}}</span>
<span>{{lastEditedBy.lastname}}</span>
<span>{{creator.firstname}}</span>
<span>{{creator.lastname}}</span>

Answer 2

实际上，您可以使用$ filter做到这一点，只需返回单个值并像这样抓取零即可...实际上，您可以创建自己的findWhere过滤器：

lrApp.filter('findWhere',function($filter){
    return function(collection,search) {
        var refined = $filter('filter')(collection,search);
        return refined[0];
    }
});

$filter('findWhere')($scope.users,{ UserID : $company.LastEditedBy });

甚至更好，我已经测试过了

angular.findWhere = function(collection,search) {
    var $filter = angular.element(document).injector().get("$filter"),
        refined = $filter('filter')(collection,search);
    return refined[0];
}

显然，您需要用启动应用程序的任何节点替换“ angular.element（document）”，而我这样做是因为我将此函数放置在run函数之外，但是如果将其放置在run函数中您只需注入$ injector服务，然后将“ angular.element（document）.injector（）”更改为“ $ injector.get（” $ filter“）”，甚至只是将$ filter注入运行函数即可。

Answer 3

我知道这个问题太老了，无法回答，但可能会对其他人有所帮助。

<span ng-bind="(users | filter : {UserID : singleCompany.Creator } : true)[0].firstname"></span>
<span ng-bind="(users | filter : {UserID : singleCompany.Creator } : true)[0].lastname"></span>
<span ng-bind="(users | filter : {UserID : singleCompany.LastEditedBy } : true)[0].firstname"></span>
<span ng-bind="(users | filter : {UserID : singleCompany.LastEditedBy } : true)[0].lastname"></span>