AngularJS更新関数はまだ動作していません

Question

オブジェクトを更新する関数があります。問題は、更新されたオブジェクトの代わりに古いオブジェクトを初期化する、更新フォームフィールドから詳細ビューに戻るときです。

代わりにapp.jsの私はCarServiceでの車のリストを移入したい

これは私のcarServiceです：

window.app.service('CarService', ['HTTPService', '$q',  
'$http', function (HTTPService, $q, $http) { 
'use strict'; 


this.cars = []; 
this.get = function() { 
var deferred = $q.defer(); 

HTTPService.get('/car').then(function resolve(response) { 
    deferred.resolve(response.data); 
}, function reject(response){ 

    deferred.reject(response);  
}); 
}; 

this.add = function (formCar) { 

var deferred = $q.defer(); 

console.log("CarService response 1 : "); 
$http.post('/#/car', formCar).then(function resolve(response){ 

    deferred.resolve(response.data); 
}, function reject(response){ 
    deferred.reject(response);  
}); 
return deferred.promise; 
}; 

this.showDetails = function (carId){ 
var deferred = $q.defer(); 

$http.get('/car/view/{{carId}}').then(function resolve(response){ 
    HTTPService.get('/car/view/' + carId).then(function 
resolve(response) { 

    deferred.resolve(response.data); 

}, function reject(response){ 
    deferred.reject(response);  
}); 
return deferred.promise; 

}; 

this.put = function (carformUpdate, opleidingsprofielId) { 
var deferred = $q.defer(); 

$http.put('/#/car/:carId/update', carformUpdate).then(function resolve(response){ 
    deferred.resolve(response.data); 
}, function reject(response){ 
    deferred.reject(response);  
}); 
return deferred.promise; 
}; 

}]); 

これは私のupdateCarコントローラです：

window.app.controller('updateCarCtrl', ['$scope', '$routeParams', 
'CarService', '$location', function ($scope, $routeParams, CarService, 
$location) { 
'use strict'; 
$scope.carId = $routeParams.carId; 
initCar($scope.carId); 


function initCar(carId) { 
     CarService.showDetails(carId).then(function success(car) { 
      $scope.car = car; 

     }, function error(response) { 
     }); 
    } 

    $scope.updateCar = function (carId) { 
     carId = $scope.carId; 

     if($scope.car !== null){ 
      CarService.put($scope.car, carId).then(function 
    success(response) { 
      $scope.car = response; 
      $location.path('/car/view/' + carId); 
      alert("Car updated"); 

     }, function error(response) { 
      $scope.error = response.statusText; 
      $scope.myform = {}; 
     }); 
     } 


    }; 

    }]); 

これは私のcarViewコントローラです：

window.app.controller('carViewCtrl', ['$scope', '$routeParams', '$location', 
'CarService', function ($scope, $routeParams, $location, CarService) { 
'use strict'; 

$scope.carId = $routeParams.carId; 
initCar($scope.carId); 

function initCar(carId) { 
    CarService.showDetails(carId).then(function success(car) { 

    $scope.car = car;    
     }, function error(response) { 
    }); 
    } 
    }]); 

私のcarViewは、$ location.path（ '/ car/view /' + carId）;でリダイレクトされたときに再びオブジェクトを初期化します。元のオブジェクトであり、更新されたオブジェクトではありません。

私はこれをngMockバックエンドで実行しようとしています。

App.js

ルーティング：

.when('/car', { 
    templateUrl: 'pages/car/car.html' 

}) 
.when('/car/view/:carId', { 
    templateUrl: 'pages/car/carView.html', 
    controller: 'carViewCtrl', 
    controllerAs: 'ctrl' 
}) 
.when('/car/addCar', { 
    templateUrl: 'pages/car/carAdd.html' 
}) 
.when('/car/:carId/update', { 
    templateUrl: 'pages/car/carUpdate.html', 
    controller: 'updateCarCtrl', 
    conrtollerAs: 'ctrl' 
}) 

app.run：私のモックバックエンドが定義されている、これはされて

window.app.run(function($httpBackend) { 
    var cars = [ 
    { 
    id: 0, 
    name: ‘car0’, 
    address: 'adress0', 
    tel: 'tel0', 
    email: 'email0'}, 
    { 
    id: 1, 
    name: ‘car1’, 
    address: 'adress1', 
    tel: 'tel1', 
    email: 'email1' 
    }]; 

    var carUrl = “/#/car”; 

    $httpBackend.whenGET(carUrl).respond(function(method,url,data) { 
    return [200, cars, {}]; 
    }); 

    $httpBackend.whenGET(/\/#\/car\/view\/(\d+)/, undefined, 
    ['carId']).respond(function(method, url, data, headers, params) { 

    return [200, cars[Number(params.carId)], { 
    carId : params.carId 
    }]; 
    }); 

     $httpBackend.whenPUT('/#/car/:carId/update').respond(function(method,  url, 
data, carId) { 
var car = angular.fromJson(data); 
return [200, car, {}]; 
    }); 

私app.js

は、このようになります

助けてくれてありがとう！

Answer 1

アップデート機能がCarService.putを呼び出しているようですが、HTTPService.putが呼び出されます。モックバックしたバックエンドでは、次のようになります。

したがって、常に新しい車を追加し、更新しません。これは、ゲットをするときに、更新されていないIDと一致する最初の車を取得する可能性があることを意味します。擬似コードで

：

// carService.cars = [{id:1,name:"name"}] 
var myCar = carService.get(1); // returns {id:1,name:"name"} 
myCar.name = "otherName"; 
carService.put(car); // -> cars.push(car); -> cars = [{id:1,name:"name"},{id:1,name:"otherName"}] 

goToDetails(1); 

var myCar = carService.get(1); // iterate over the cars, and return the one with id = 1, 
// which is {id:1,name:"name"}