angularjs - Adding a new item with $recource in Angular JS -
i have created simple app store event database. working fine wordaround.
i use following method:
controllers.controller('calendaraddcontroller', function($scope, $routeparams, event) { $scope.addevent = function() { $scope.ev=new event(); $scope.ev.title = $scope.event.title; $scope.ev.$save().then(function(res) { console.log("success");}) .catch(function(req) { console.log("error saving obj"); }) .finally(function() { console.log("always called") }); } }); after submitting form, function addevent called. if print value of $scope.event, has right values. however, when call .$save() on it, error "typeerror: $scope.event.$save not function."
but when create new object , assign values it, works fine.
why isn't working directly? creating dummy object not seem best practice suppose.
the service created
services.factory( 'resource', [ '$resource', function( $resource ) { return function( url, params, methods ) { var defaults = { update: { method: 'put', isarray: false }, create: { method: 'post' } }; methods = angular.extend( defaults, methods ); var resource = $resource( url, params, methods ); resource.prototype.$save = function() { if ( !this.id ) { return this.$create(); } else { return this.$update(); } }; return resource; }; }]); services.factory( 'event', [ 'resource', function( $resource ) { return $resource( '/api/calendar/:id' ); }]); update: basic example
using example works front-end in rest api data not passed.
<!doctype html> <html lang="en-us"> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script> <script type="text/javascript"> var app = angular.module('app', ['ngroute','ngresource']) .config(function($routeprovider) { $routeprovider .when('/', { templateurl : 'pages/home.html', controller : 'maincontroller' }) }); app.factory('event', function($resource) { return $resource('/test/api/:id'); }); app.controller('maincontroller', ['$scope', '$routeparams', 'event', function($scope, $routeparams, event) { function handlesuccess(data) { alert("success"); } function handleerror(data) { alert("error"); } var event = new event(); event.title = "a title"; event.save(event, handlesuccess, handleerror); }]); </script> <body> <div ng-app="app"> <div ng-view></div> </div> </body> </html> for back-end created basic script writes request file: says "array()" no data passed.
<?php $myfile = "testfile.txt"; $fh = fopen($myfile, 'w') or die("can't open file"); $stringdata = print_r($_request,true); fwrite($fh, $stringdata); fclose($fh); ?>
where initialize $scope.event or automatically created angular? if plain javascript object can't call .$save, can use event service - no need create new instance:
event.create($scope.event)
Comments
Post a Comment