0

I have resource that gets an object:

.factory('Product', ['$resource', function($resource) {
    return $resource( 'api/product/:id', { Id: '@Id' }, { 
            update: { method: 'PUT', isArray: false }
        });
}])

I call this resource from the ng-route, in the /edit/product/:sku using 'resolve'

.config(['$routeProvider',  function($routeProvider) {
  $routeProvider.
    when('/index', {
      templateUrl: 'lord/partials/main'
    }).
    when('/product/edit/:SKU', {
      controller: 'EditCtrl',
      templateUrl: function(params){ return 'lord/partials/product/edit' },
      resolve: {
        product: function( Product, $routeParams ){
            return Product.get({ id: 101 }).$promise;
        }
      }
    }).
    otherwise({
      redirectTo: '/index'
    });
}]);

In my controller, I receive product successfully:

.controller('EditCtrl', ['$scope', 'product',  function ($scope, product) {

 console.log(product.measures);  // I get the object -> Object {weight: 100, length: 200, width: 180, height: 200}   

//Initialize object:
$scope.datos = {};
$scope.datos.measures = {};

However, when i want to "copy" that object to a scope variable, it doesn't work. The scope variable is $scope.datos, which is an object, in a form. I populate this object like this:

      <div class="col-md-1">Peso</div>
      <div class="col-md-2">
       <div class="input-group">
        <input type="number" class="form-control" ng-model="datos.measures.weight" >
        <span class="input-group-addon">gr</span>
      </div>
      </div>
      <div class="col-md-1">Largo</div>
      <div class="col-md-2">        
       <div class="input-group">
        <input type="number" class="form-control" ng-model="datos.measures.lenght">
        <span class="input-group-addon">cm</span>
      </div>
      </div>
      <div class="col-md-1">Ancho</div>
      <div class="col-md-2">
      <div class="input-group">
        <input type="number" class="form-control" ng-model="datos.measures.width">
        <span class="input-group-addon">cm</span>
      </div>

      </div>
      <div class="col-md-1">Alto</div>
      <div class="col-md-2">
      <div class="input-group">
        <input type="number" class="form-control" ng-model="datos.measures.height">
        <span class="input-group-addon">cm</span>
      </div>

I tried, in the controller, several methods to copy the value that I receive into the object.

I tried:

angular.copy(product.measures,$scope.datos.measures);

And:

$scope.datos.measures = angular.copy(product.measures);

And:

$scope.datos.measures = product.measures;  
$scope.datos.measures.weight   =  product.measures.weight;

And none of these worked.

However, assigning the product.measures.width into any variable, like $scope.dwidth, works. But this is not what I want, since my object is far more complex.

How can I get to copy the values of the object I receive (product.measures) into another object ($scope.datos.measures) and reflect that value in the with ng-model?

Thank you.

medarz
  • 11
  • 2
  • I suspect it's related to having two dots in your binding and the way you are assigning values to the scope. Take a look at this oft-cited answer http://stackoverflow.com/questions/14049480/what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs/14049482#14049482 – Ian Mercer Dec 04 '14 at 01:27
  • Thanks for your comments. I took a look to the post you suggest. In another page, I was able to assign in another Controller values such as $scope.stock.total=10, so the two dots is supported. – medarz Dec 04 '14 at 15:43

1 Answers1

0

I was able to determine what was happening. I was calling another controller that was resetting these values.

So the route controller was called (EditCtrl) but after that, the controller in the page reset the values.

After that, it was enough with the following code:

angular.copy(product.measures,$scope.datos.measures);

That made the trick and copied the whole object.

Also, I had to change tue $scope.datos.measures.length name to $scope.datos.measures.len due to the Javascript property.

medarz
  • 11
  • 2