Extending a base class in an Angular service

Question

I have a base class that I would like to extend in a service to help get data in to the angular scope. I have searched around the net for a solution, but have not found one

Answer 1

This question was asked, and answered, 18 months ago. I recently went through the same issue on a project. I wanted to have a base Model defined that I could use to build factories off of. Angular has a very simple Provider to assist with this called the Value Provider, which Angular implements using the Value Recipe.

I'm not sure what version of Angular you may have been using at the time, but this dates back (AFAIK) to version 1.3.0. (As of this writing, current stable is 1.4.8)

I'm also using John Resig's Simple Inheritance Script. http://ejohn.org/blog/simple-javascript-inheritance/

Here's a snippet of my code (with most of the application specific logic removed).

var MyApp = angular.module( 'MyApp',['ngResource','ngAnimate','ngSanitize'] );

/* ==================================================================================== */
// -   Base Model Class   -------------------------------------------------------------
/* ==================================================================================== */

MyApp

/**
 * BaseModel - Value Provider
 * 
 */
.value( 'BaseModel',Class.extend({

    attribs: {},

    init: function(){

        var self = this;

        _active = true;

        _new = true;

        _origs = {};

        _loadByObject = function( obj ){ ... }
    },

    get: function( key ){ ... },
    set: function( key,val ){ ... },

    isNew: function(){ ... },
    keep: function(){ ... },
    remove: function(){ ... },

    load: function( obj ){ ... }
    verify: function(){ ... },      
    save: function(){ ... },

}))

.factory( 'UserFactory', 
    [ '$http', '$q', 'BaseModel', 
    function( $http, $q, BaseModel ){

    var UserFactory = BaseModel.extend({

        init: function(){

            this._super( false );

            _fields = [
                'first', 'last', 'email', 
                'phone', 'password', 'role'
            ];

            _permitted = [
                'first', 'last', 'email', 
                'phone', 'password', 'role'
            ];

            _required = [
                'first', 'last', 'email', 'role'
            ];

            _resource = "users";

            _api = "users";

        }

    });

    return UserFactory;

}])

I'd love to hear anyone's feedback, too.

Here's the Angular Docs: https://code.angularjs.org/1.3.0/docs/guide/providers