Wie kann man den angularJS-Dienst in einen Controller aufrufen, der nicht in einem Controller enthalten ist?

Question

Wie wird der angularJS-Dienst in eine Steuerung aufgerufen, die nicht in einer Steuerung enthalten ist?

productCtrl.js

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

app.controller('productCtrl',['$scope','productService', function ($scope,campaignService) 
    { 
     $scope.getLocations = function() { 
     productService.getPorduct(response,status); 
    } 
}]); 

productService.js

var app = angular.module("myApp", []); 

app.service('productService', ['ajaxService', function (ajaxService) { 

this.getPorduct = function (successFunction, errorFunction) { 

    ajaxService.AjaxGet("http:location.com/product#?clientid=10",  

successFunction, errorFunction); 

    }; 
}]); 

ajaxService.js

var app = angular.module("myApp", []); 

app.service('ajaxService', ['$http', 'blockUI', function ($http, blockUI) { 

this.AjaxGet = function (route, successFunction, errorFunction) { 
    blockUI.start(); 
    setTimeout(function() { 
     $http({ method: 'GET', url: route }).success(function (response, status, headers, config) { 
      blockUI.stop(); 
      successFunction(response, status); 
     }).error(function (response) { 
      blockUI.stop(); 
      errorFunction(response); 
     }); 
    }, 1000); 

} 

}]); 

Wenn ich Zugriff auf die Steuerung das Ergebnis von URL zu erhalten, verfolge ich immer Fehler angular.js:13294 Error: [ng:areq] Argument 'productCtrl' is not a function, got undefined

Answer 1

sicher, dass Sie Winkel module mit demselben Namen nur erstellt sollten für die Erweiterung & dann nutzen dieses Modul pro Anwendung einmal definieren sollen Komponente dazu.

Hier kann ich drei Plätze sehen, wo Sie Modul wie

var app = angular.module("myApp", []); 

Es sollte nur einmal erstellt werden und dann wie angular.module("myApp") verwendet erstellt haben, in dem Sie Komponente zu diesem Modul

productService.js & ajaxService.js hinzufügen wollte sollte Modul zunächst Modul von productCtrl.js (vorausgesetzt productCtrl.js zuerst geladen) verwendet werden. Sie müssen productService.js & ajaxService.js Code von

var app = angular.module("myApp", []); 

zu

var app = angular.module("myApp"); 

---

besser ändern var app = angular.module("myApp", []); Auch entfernen Sie diese Zeile aus anderen js-Datei, die später geladen werden, dann werden sie app Variable verwenden, die ist bereits geladen mit myApp Modul

Answer 2

Nur anrufen th e Modul mit [] einmal, danach einfach den Modulnamen verwenden.

// Creates the module 
var app = angular.module("myApp", []); 

// call the same module from your other files 
var app = angular.module("myApp"); // no [] 

See the documentation here.

In einer Nussschalen mit [] erzeugt eine neue Instanz, während ohne [] eine bestehende/bereits erstellte Instanz abruft. Stellen Sie sicher, dass Ihre Skripts geordnet sind, sodass der erste Aufruf immer mit dem Parameter [] erfolgt.