How to define ngModel inside angular factory?

Question

I have a scope inside a directive. I am able to access the directive scope inside my factory but after getting the scope I need to bind it with input controls for a two way binding.

For example the directive scope: This scope getting from controller and then assigning to directive.

 $scope.model = {
    "entityinfo": {
      "entity":"",
      "tenantId":"292FEC76-5F1C-486F-85A5-09D88096F098",
      "timeStamp":"2015-12-15T10:16:06.322Z"
    },
    "collections":{}
 }

I need to bind this scope to an input control

var template='<input  ng-model="model[tranobj].rowset[0][field]">';

Here tranobj and field will be fetched dynamically. The problem is I'm defining rowset as an array but it's an object inside the property '0'.

It's coming in like this:

"Customer29Jan16": {
      "rowset": {
        "0": {
          "CuId": "dgdfg",
          "Name": "dgdgf",
          "Quantity": "3",
          "Rate": "5",
          "Amount": "4"
        }
      }
    }

But I need it like this:

"Customer29Jan16": {
      "rowset": [
         {
          "CuId": "dgdfg",
          "Name": "dgdgf",
          "Quantity": "3",
          "Rate": "5",
          "Amount": "4"
        }
        ]
    }

Directive Code added:

bosAppModule.directive('layoutTableCellControlControlRender',['$compile','layoutRenderingControlsFactory','soObjectFactory','$parse', function($compile,layoutRenderingControlsFactory,soObjectFactory,$parse){
    var layoutTableCellControlRenderObj={};
    linkFnTableCellControlRender=function(scope, element, attributes, controllerCtrl) {
        scope.controlData="NOCONTROLDATA";
        var controlContent="";
        var bindingPath = "";
        angular.forEach(scope.mapperData.collections.controltype.rowset, function (value, index) {
            if(value.controltypeid==scope.controlId){
                scope.controlData=value.controltypename;
                if(scope.controlData){
                    controlContent=angular.element(layoutRenderingControlsFactory[scope.controlData](scope.controlId, bindingPath));
                    $compile(controlContent)(scope);
                    element.append(controlContent);
                }else{
                    console.log("## control data not matching");
                }

            }
        }); 

    };  
    layoutTableCellControlRenderObj.scope={attributeId:'=',controlId:'=',layoutData:'=',pageObject:'=',mapperData:'=', cellControlId:'=', soData:"=",model:"=",field:"@",tranobj:"@" };
    layoutTableCellControlRenderObj.restrict='AE';
    layoutTableCellControlRenderObj.replace='true';
    layoutTableCellControlRenderObj.template="<div class='col-xs-12 col-sm-12 col-md-6 col-lg-6' ng-attr-id={{cellControlId}} cell-control-id='tablecellcontrol.layouttablecellcontrolcellcontrolid' " +
                                            "control-id='tablecellcontrol.layouttablecellcontrolcontroltypeid' " +
                                            "layout-data='layoutData' page-object='pageObject' mapper-data='mapperData' attribute-id='tablecellcontrol.layouttablecellcontrolbindingobjectattributeid'" +
                                            "model='model' field={{tablecellcontrol.attributename}} tranobj={{tablecellcontrol.objectname}}>" +

        layoutTableCellControlRenderObj.link = linkFnTableCellControlRender;
    return layoutTableCellControlRenderObj; 
}]);

Answer 1

You have to map your object to an array of objects. You can go through this link Converting a JS object to an array .

You can do it like this inside controller

var array = [];
angular.forEach(Customer29Jan16.rowset, function(object, index) {
    array.push(object);
});

console.log(array);
Customer29Jan16.rowset = array;