Создание функции в Angular

0

У меня есть два контроллера с кнопкой сохранения, которая по сути делает то же самое. Поэтому я хочу включить его в функцию многократного использования, которую могут использовать оба контроллера. Я попытался сделать это, создав нормальную функцию и передав объект модели, а также $ http, но функция выполняется до нажатия кнопки сохранения, приводя к тому, что все параметры не установлены. Каким образом я могу создать функцию, которую могут использовать оба этих контроллера?

Вот как выглядит код:

app.controller('addCtlr',['$scope','$http','$location',
    function($scope, $http, $location){
        $scope.save = function(){
        var practices = [];
        var url = "https://maps.googleapis.com/maps/api/geocode/json?address="+$scope.location.address.replace(/ /g,"+");


    //If there are practices
        if($scope.days){
            for(dayName in $scope.days){                                                            //Loop through the days object              
                var day = $scope.days[dayName];                                                     //Gets the day pratice object
                practices.push({day: dayName, start_time: day.startTime, end_time: day.endTime});    //Add the pratice object to the practices array
            }
        }
    //Call to get the lat lng and formatted address from Google Map service
        $http.get(url)
        .then(function(response){
            locJSON = response.data.results[0];                         //The JSON response

            //createing an object to send to the backend to save
            var locObj = {
                name: $scope.location.name,
                address: locJSON.formatted_address,
                location: locJSON.geometry.location,
                cost: $scope.location.cost,
                practices: practices,                                      
                notes: $scope.location.notes
            };

            //Sending using POST since a new object is being created
            $http.post('/api/locations', locObj)
            .then(
                $location.path('/')                                     
            );
        });//*/
    };
    }]);

Так выглядела моя функция:

function saveLocation(location, days, $http){
    var practices = [];
    var url = "https://maps.googleapis.com/maps/api/geocode/json?address="+location.address.replace(/ /g,"+");


//If there are practices
    if(days){
        for(dayName in days){                                                            //Loop through the days object              
            var day = days[dayName];                                                     //Gets the day pratice object
            practices.push({day: dayName, start_time: day.startTime, end_time: day.endTime});    //Add the pratice object to the practices array
        }
    }
//Call to get the lat lng and formatted address from Google Map service
    $http.get(url)
    .then(function(response){
        locJSON = response.data.results[0];                         

    //createing an object to send to the backend to save
        var locObj = {
            name: location.name,
            address: locJSON.formatted_address,
            location: locJSON.geometry.location,
            cost: location.cost,
            practices: practices,                                      
            notes: location.notes
        };

    //Sending using POST since a new object is being created
        $http.post('/api/locations', locObj)
        .then(
        //$location.path('/')                                     //Redirects the user back to the homepage 
        );
    });
}

Так я называл функцию в новом контроллере:

app.controller('addCtlr',['$scope','$http','$location',
    function($scope, $http, $location){
        $scope.save = saveLocation(location, days, $http);
}]);
Теги:

3 ответа

2

Вы можете использовать сервис для этого. Сервис - это singleton, поэтому будет создан только один экземпляр. И вы можете вводить его инжектором зависимости для контроллеров. Вы можете прочитать больше здесь

1

Вы можете создать сервис для своей общей функциональности и ввести его в свой контроллер, как показано ниже.

var app=angular.module('app',[])

app.service('myService',function($http){

  this.saveLocation=function(){
  //Your code
  }

});

а затем в контроллере вы можете ввести его, как показано ниже.

app.controller('myController',['$scope','myService',function($scope,myService){
 //use myService function to call save functionality
}]);

Также, если вы используете $ http, вы должны иметь в виду, что он возвращает обещание, поэтому вам нужно написать весь код, который зависит от значения этого обещания в обратном вызове успеха, иначе ваш код будет работать до этого обратного вызова, и вы будут иметь неопределенные значения для этих переменных.

0

Используйте службу factory(). Вы можете определить набор функций и вернуть их как объект. Затем этот объект может быть введен в любой контроллер:

app.factory('sharedFactory', [function() {
    "use strict";

    return {
        myFunction: function() {
            console.log("sharedFunction");
        }
    };

}]);

app.controller('AnyController', ['sharedFactory', function(sharedFactory) {
    "use strict";

    sharedFactory.myFunction();

}]);
  • 0
    Похоже, я не могу использовать $ scope при создании службы. Есть ли способ передать объект модели в качестве параметра в сервис?
  • 0
    Вы можете передать переменную $ scope в качестве аргумента любой функции, возвращаемой службой. Просто определите $ scope как параметр функции возвращаемой функции в сервисе и передайте объект из контроллера.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню