javascript - Add new item using $resource -

i new angularjs. learning it. have created product list using get method of web api angularjs. want add new product. facing couple of problems. first ngdialog closing automatically whenever click outside it, , don't know how call save methods using $resource. code trying.

myapp.controller('productcontroller', function ($scope, $http, $resource, ngdialog) {   product = $resource('/api/product')   $scope.product = product.query();    $scope.openproductform = function () {     ngdialog.open({ template: 'product/addnewtemplate.html' })   };    $scope.addproduct = function () {      var newproduct = $resource('/api/product/:id', { id: '@id' });     newproduct.save();   } }); 

try adding $resource service routes factory , use in controller through methods:

myapp.controller('productcontroller', function ($scope, $http, yourresource, ngdialog) {     $scope.openproductform = function () {     ngdialog.open({ template: 'product/addnewtemplate.html' })   };    $scope.addproduct = yourresource.save({id: id}, function (response) {     $scope.id= response.id;   }; }).factory('yourresource', ['$resource', function ($resource) {   return $resource('/api/product/:id', { id: '@id' } {     'save': {       method: 'put',       headers: {"content-type": "application/json"}     }   }); }]);