6

Mam problem na zastanawianie się, jak przekazać parametry od mojego angularcontroller do serviceangularjs: przechodzącą params z kontrolera do służby

#my controller 
'use strict'; 

angular.module('recipeapp') 
    .controller('recipeCtrl', ['$scope', 'recipeService', 
    function($scope, recipeService){ 
     $scope.recipeFormData={}; 
     $scope.recipeSave = function(){ 
     recipeService.saveRecipe(); 
     } 


    }]); 

#my service 
'use strict'; 
angular.module('recipeapp').service('recipeService',['$http', function($http){ 

    this.saveRecipe = save; 

    function save(callback){ 
    //calling external http api 
    } 

}]); 

Co usiłuję zrobić tutaj jest, coraz $scope.formData z moja forma i kontroler powinien przekazać, że do service, Jak na moje rozumienie, nie mogę używać $scope wewnątrz service więc muszę znaleźć sposób przekazywania $scope.formData służbie

trudne pomysłem byłoby, w sterowniku, recipeService.saveRecipe($scope.formData); ale nie jestem pewien, jak zebrać że ze służby,

kiedy zmienił usługę this.saveRecipe(val) = save; to robi praca :(

każda pomoc będzie appriciated

+0

Zapis jest niezdefiniowany, gdy jest przypisany do saveRecipe. Umieść zadanie po funkcji zapisu.Ponadto zazwyczaj nie trzeba ręcznie tworzyć danych formularza. Zwykle można związać się z modelem, a następnie przekazać model do funkcji saveRecipe – pixelbits

+0

Przekaż zmienną jako parametr – Satpal

+0

@pixelbits, dziękuję za odpowiedź .. Mam model, który wiąże wartości z formularza. czego nie mogę się dowiedzieć, to jak przekazać model do funkcji 'saveRecipe' w usłudze?! – sameera207

Odpowiedz

16

Ten przykład pokazuje właściwą strukturę kątową aplikacji: Inicjowanie

  • modelu wewnątrz kontrolerze
  • wdrożenia usługi singleton i wtrysk do kontrolera
  • Użycie obietnicy $ HTTP do asynchronicznego wywoływania wywołań interfejsu API sieci Web i umożliwienia rozmówcom usługi obsługi ich sukcesu/niepowodzenia.
  • Wykorzystanie metody składni "kontroluj jako" w celu ujawnienia funkcji ze sterownika zamiast prezentowania funkcji bezpośrednio z zakresu.
  • Dwukierunkowy model danych wiązania (pole tekstowe do receptury i przepis do pola tekstowego)

Inicjalizacja swój model w kontrolerze:

angular.module('recipeapp') 
    .controller('recipeCtrl', ['$scope', 'recipeService', 
    function($scope, recipeService){ 
     // initialize your model in you controller 
     $scope.recipe={}; 

     // declare a controller function that delegates to your service to save the recipe 
     this.saveRecipe = function(recipe) { 
      // call the service, handle success/failure from within your controller 
      recipeService.saveRecipe(recipe).success(function() { 
       alert('saved successfully!!!'); 
      }).error(function(){ 
       alert('something went wrong!!!'); 
      }); 

     } 
    }]); 

w usłudze receptury, określenie saveRecipe funkcja:

angular.module('recipeapp').service('recipeService',['$http', function($http){ 

    // expose a saveRecipe function from your service 
    // that takes a recipe object 
    this.saveRecipe = function(recipe){ 
     // return a Promise object so that the caller can handle success/failure 
     return $http({ method: 'POST', url: '/api/recipe/add', data: recipe}); 
    } 

}]); 

Powiąż obiekt receptury ze swoim widokiem; dodać przycisk, aby wywołać funkcję kontrolera saveRecipe i zapisać recepturę (przechodzącą w obiekcie modelu receptury):

<div ng-app="recipeapp" ng-controller="recipeCtrl as ctrl"> 
    <form name="recipeForm"> 
    Recipe Name: <input type="text" ng-model="recipe.name" /> 
    <button ng-click="ctrl.saveRecipe(recipe)">Save Recipe</button> 
    </form> 
</div> 
+0

działa idealnie, bardzo dziękuję: D, całkiem nowy dla "kątowego" i wciąż się uczy :) – sameera207

1
var module = angular.module('example.service', []); 


module.services('ExampleServices', ['$http', '$q', function ($http, 
$q) { 

    var resourceUrl; 

    return { 


     setResourceUrl: function(resourceUrl) { 
      this.resourceUrl = resourceUrl; 
     }, 



     create: function(params) { 
      //access params here sent from controller 
      //make call to server using $http 
      //return back the promise or response 
     }, 



     remove: function(id) { 
      //access id here sent from controller 
      //make call to server using $http 
      //return back the promise or response 
     } 

} 

Później w kontrolerze wstrzyknąć ExampleServices usług

a następnie dostęp:

ExampleServices.create(params) 

Parametry mogą być dowolnymi obiektami, najprawdopodobniej danymi przechwyconymi za pomocą formularzy.

ExampleServices.remove(id) 

id może być głównym identyfikatorem rekordu do usunięcia z bazy danych.

Nadzieję, że pomaga :)

+0

Dzięki za formatowanie @Tetiana Chupryna –

+0

Moja przyjemność @ Koder John –