Метод сохранения и удаления Angularjs

У меня есть проблема с угловыми. Пожалуйста, помогите мне! Я смотрю клип [клип]: https://www.youtube.com/watch?v=Q8FRBGTJ020 и делаю аналогичный код, но метод save и delete не искушает.Метод сохранения и удаления Angularjs

мой HTML:

{% load staticfiles %} 
<!DOCTYPE html> 
<html ng-app ="SimpleController"> 
    <head> 

    </head> 
    <body> 
     <div ng-controller="RoleList" ng-init="initialize['Ready']"> 
      <h1>List Role</h1> 
      <ul> 
       <li ng-repeat = "item in items"> 
        [{[ $index ]}] :[{[ item.roleName ]}] :[{[item.roleDescription]}] 
        <button ng-click="delItem(item)">Del</button> 
       </li> 
      </ul> 
      <form> 
       <ul> 
        <li> 
         Name: <input type="text" name="name" ng-model ="currentItem.name"/> 
        </li> 
        <li> 
         Description : <input type="text" name="description" ng-model="currentItem.description" /> 
        </li> 
       </ul> 
       <button ng-click="saveItem()">save</button> 
      </form> 
      <pre>currentItem: [{[currentItem|json ]}]</pre> 
      <pre> items: [{[items | json]}]</pre> 

    </div> 
    <script src="{{STATIC_URL}}js/jquery-1.11.0.min.js"></script> 
     <script src="{{STATIC_URL}}jquery/angular.min.js"></script>  
     <script src="{{STATIC_URL}}jquery/angular-route.min.js"></script> 
     <script src="{{STATIC_URL}}jquery/angular-cookies.min.js"></script> 
     <script src="{{STATIC_URL}}jquery/angular-sanitize.min.js"></script> 
     <script src="{{STATIC_URL}}jquery/angular-resource.min.js"></script> 
     <script src="{{STATIC_URL}}js/demoapp.js"></script> 
    </body> 
</html>

мои ЯШ:

var SimpleController = angular.module('SimpleController',['ngCookies','ngResource']); 

SimpleController.config(function($interpolateProvider) 
{ 
    $interpolateProvider.startSymbol('[{['); 
    $interpolateProvider.endSymbol(']}]'); 
}); 

SimpleController.run(function($rootScope,$log,$http,$cookies){ 
    $http.defaults.headers.common['X_CSRFToken'] = $cookies['csrktoken']; 
}); 

SimpleController.factory('ModelUtils', function($http, $log){ 

    var ModelUtils = { 
     get: function(url,id){ 
      $http.get(url +id+ '/').then(function(response){response.data});  
     }, 
     create: function(url, obj){ 
      return $http.post(url, obj), 
       success(function(response, status, headers, config){ 
        angular.extend(obj, response); 
       }).error(function(response, status, headers, config){ 
        console.log(data) 
       }); 
     }, 
     save: function(url, obj){ 
      if (angular.isDefined(obj.id)) { 
       return $http.put(url +obj.id+ '/',obj).success(function(response, status, header,config){ 
        angular.extend(obj, response); 
       }).error(function(response, status, headers, config){ 
        console.log(data)}); 
      }else { 
       return this.create(url, obj); 
      } 
     }, 
     del: function(url, obj){ 
      return $http.delete(url +obj.id+ '/'); 
     } 
    }; 
    return ModelUtils; 
}); 

SimpleController.controller('RoleList', function RoleList($scope,$log,$http,ModelUtils){ 
    $scope.items = []; 
    $scope.initialize = function(data){ 
     $log.log('initialize',data); 
     $scope.initData = data; 
    }; 
    $scope.loadItems = function(){ 
//  $scope.items = $http.get('http://localhost:8000/myapp/role/').then(function(response){ 
//   return response.data;  
     $http.get('http://localhost:8000/myapp/role/') 
     .success(function(data){ 
      $scope.items = data; 
     }).error(function(data){ 
      console.log(data) 
      //$scope.items = data; 
     }); 
    }; 
    $scope.loadItems(); 
    $scope.currenItem = {}; 

    $scope.saveItem= function(){ 
     ModelUtils.save('http://localhost:8000/myapp/role/',$scope.currenItem).then(function(){ 
      $scope.loadItems(); 
      $scope.currentItem = {}; 
     }); 
    }; 
    $scope.delItem = function(item){ 
     ModelUtils.del('http://localhost:8000/myapp/role/',item).then(function(){ 
      $scope.loadItems(); 
     }); 
    }; 

});

и моя ошибка:

ReferenceError: success is not defined 
at Object.ModelUtils.create (http://localhost:8000/static/js/demoapp.js:22:5) 
at Object.ModelUtils.save (http://localhost:8000/static/js/demoapp.js:35:17) 
at k.RoleList.$scope.saveItem (http://localhost:8000/static/js/demoapp.js:66:14) 
at http://localhost:8000/static/jquery/angular.min.js:177:3 
at http://localhost:8000/static/jquery/angular.min.js:194:165 
at k.$eval (http://localhost:8000/static/jquery/angular.min.js:112:68) 
at k.$apply (http://localhost:8000/static/jquery/angular.min.js:112:346) 
at HTMLButtonElement.<anonymous> (http://localhost:8000/static/jquery/angular.min.js:194:147) 
at HTMLButtonElement.n.event.dispatch (http://localhost:8000/static/js/jquery-1.11.0.min.js:3:8066) 
at HTMLButtonElement.r.handle (http://localhost:8000/static/js/jquery-1.11.0.min.js:3:4774) angular.min.js:92 
POST http://localhost:8000/myapp/role/ 400 (BAD REQUEST) angular.min.js:79

и ошибка в моих ЯШ:

success(function(response, status, headers, config){ 
       angular.extend(obj, response); 

return this.create(url, obj); 

$scope.saveItem= function(){ 
    ModelUtils.save('http://localhost:8000/myapp/role/',$scope.currenItem).then(function(){ 
     $scope.loadItems(); 
     $scope.currentItem = {}; 
    });

источник

2014-09-09 Vĩ Lương

Заменить

return $http.post(url, obj), 
       success(function(response, status, headers, config){

По

return $http.post(url, obj). 
       success(function(response, status, headers, config){

Кроме того, я предлагаю вам не смешивать обратные вызовы и обещают ... потому что комплексифицировать код. Предпочтительно использовать всегда

return $http.[verb]().then()

достаточно.

источник

2014-09-09 08:59:53 benek

Спасибо! Я исправил его, но у меня другая ошибка: POST http: // localhost: 8000/myapp/role/400 (BAD REQUEST) –

Вы можете проверить свой запрос и его параметры на вкладке chrome/F12/network. Что-то в запросе делает ваш запрос отклонен бэкэнд. – benek

Oh !! Огромное спасибо! Я сделал –

Метод сохранения и удаления Angularjs

ответ

Смежные вопросы