AngularJS Model-level Helpers

Question

I have a user model that looks like:

{
    accessFailedCount: 0
    active: false
    created: "2014-05-09T14:39:56.867Z"
    email: "[email protected]"
    emailConfirmed: false
    fullName: "Austin Frtizer"
    id: "536ce8bce352b815b8791f53"
    imageId: null
    isMe: true
    lastLogin: "2014-05-09T14:39:56.867Z"
    userName: "admin"
}

I want to add a helper that will return the display name from my model instance... but it could be a combination of values depending on the values filled out such as:

fullName || email || userName

with other JS frameworks I've used you could 'wrap' the model results from the server with helper methods like myInstanceModel.displayName().

I know you could do this a million different ways, but I was wondering if there what the 'angular way' would be for something like this.

Answer 1

One of the million ways, create a filter:

app.filter('displayName', function() {
    return function(user) {

        return user.fullName || user.email || user.userName;
    }
});

then in your html:

{{user | displayName}}

or use it inside a controller:

function myCtrl($scope, $filter)
{
    var displayName = $filter('displayName')(user);
}