Using Getter / Setter Methods in AngularJS Factory

Question

I am facing serious headaches that are trying to create factories for one of my angular modules. I need to take some JSON data and be able to work with it, preserving the original format so that I can return it back to the string. so if i have json data like:

[ [ '11/09/2012', {gender:'M'}, 'John', 'Smith'], ['07/22/1986', {gender:'M'}, 'Bill', 'Miller], ...]

I want to be able to call data.birthday or data.firstName instead of tracking the structure in my view.

For this, I have a factory that looks like this:

.factory('DataObject', function () {

        DataObject.prototype.objToArray = function()
        {
            var arrayVal = [];

            arrayVal[0] = this.bday;
            arrayVal[1] = this.phys;
            arrayVal[2] = this.fname;
            arrayVal[3] = this.lname;               
            return arrayVal;
        };

        function DataObject(data, valueBuilder) {
            if(data)
            {
                this.bday = data[0];
                this.phys = data[1];
                this.fname = data[2];                   
                this.lname = data[3];
            }
        }
        return (DataObject);
    })

This part works great. The problem is that I also want to add angular access methods to allow me to get / set nested values ​​such as gender. sort of:

get gender(){ return this.phys.gender; }

, factory. , , -

function DataObject(data, valueBuilder) {}
return DataObject;

return { get gender(), set gender(val)};

, factory . , - . ?

Answer 1

. Person, PersonFactory, . toArray, . Person javascript angular, .

(function(angular)
{
  var Person = function(data)
  {
    item = {
      bday:  data[0],
      phys:  data[1],
      fname: data[2],                   
      lname: data[3],

      get gender() { return this.phys.gender; }
    };
    return item;
  };
  var personModule = angular.module('zaysoApp.personModule', []);

  personModule.factory('personFactory', [ function()
  {
    return { create: function(data) { return new Person(data); }};
  }]);

  personModule.controller('PersonTestController', ['$scope','personFactory',
  function($scope,personFactory) 
  {
    // Pretend we used angular.fromJson() to make these
    var p1 = ['11/09/2012', { gender: 'M' }, 'John', 'Smith'];
    var p2 = ['07/22/1986', { gender: 'M' }, 'Bill', 'Miller'];

    [p1,p2].forEach(function(data)
    {
      person = personFactory.create(data);
      console.log(person.fname + ' ' + person.gender);
    });
  }
]);
})(angular);

, , , , , angular.

Answer 2

angular. setter Mr getter :

var myApp = angular.module('myApp', []);

myApp.service('userService', [function () {
    var first_name, last_name;
    this.user = {
        get name() {
            return ':' + first_name;
        },
        set name(val) {
            first_name = 'Mr ' + val;
        }
    };
    return this.user;
}]);

myApp.controller('testCtrl', ['$scope', 'userService', function ($scope, userService) {
    userService.name = 'Been';
    
    $scope.test = userService;
    
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp">
<h2>Test Controller</h2>
    <div class="wrapper" ng-controller="testCtrl">
        My Name {{test.name}}
    </div>
</div>

Hide result

Answer 3

, , ? , . , , .

:

https://jsfiddle.net/1bejzxwq/

angular.module('HelloApp', [])
    .factory('DataObjectFactory', [DataObjectFactory])
    .controller('Test', ['$scope', 'DataObjectFactory', Test]);


function Test ($scope, DataObjectFactory) {
    $scope.hi = "hi";

    var data = [ '11/09/2012', {gender:'M'}, 'John', 'Smith'];
    var object = DataObjectFactory.DataObject(data);
    console.log(object.getFirstName());
}

function DataObjectFactory () {

    var service = {
        DataObject: function (data) {
            return new DataObject(data);
        }
    };

    return service;

    function DataObject(data) {
        if(data) {
            this.bday = data[0];
            this.phys = data[1];
            this.fname = data[2];                   
            this.lname = data[3];
        }

        this.getFirstName = function () {
            return this.fname || null;
        }
    }
}

, ( 2):

Angular.js