programing

단순 js 코드에서 angularjs 서비스를 호출합니다.

goodsources 2023. 3. 2. 22:13
반응형

단순 js 코드에서 angularjs 서비스를 호출합니다.

다음과 같은 angularjs 서비스가 있습니다.

angular.module('app.main').factory('MyService', ["$http", function ($http) {
    return new function () {

        this.GetName = function () {
            return "MyName";
        };
    };
}]);

전화하려면 어떻게 해야 하나요?GetName에서 기능하다MyService기존 JS 코드에서요?

각지게 사용하세요.인젝터코드를 사용하여 다음과 같은 작업을 수행할 수 있습니다.

angular.module('main.app', []).factory('MyService', ['$http', function ($http) {
    return new function () {

        this.GetName = function () {
            return "MyName";
        };
    };
}]);


angular.injector(['ng', 'main.app']).get("MyService").GetName();

여기 jsfiddle이 있습니다.http://jsfiddle.net/wGeNG/

메모 - 커스텀모듈을 로드하기 전에 첫 번째 모듈로 "ng"를 추가해야 합니다.이것은 샘플코드가 ng모듈에 있는 $http 프로바이더에 의존하기 때문입니다.

편집 - 사용get()OP의 답변과 동일하지만 이 코드는 앱 모듈 "main.app"에 바인딩된 요소에 의존하지 않고 서비스를 가져옵니다.

저는 다음과 같이 동작했습니다.

angular.element(document.body).injector().get("MyService")

다음을 시도했을 때 '알 수 없는 공급자' 오류가 발생했습니다.

angular.injector(['ng', 'main.app']).get("MyService")

jqLite를 사용하고 있기 때문에

angular.element('*[ng-app]')

왜냐하면 셀렉터는 jqLite에서는 지원되지 않지만 [Dor Cohen]아이디어가 떠올랐어요ng-app 지시가 바디 태그에 있습니다.그 후 다음을 사용할 수 있습니다.

angular.element(document.body).injector().get("MyService")

또는

angular.element(document).find('body').injector().get("MyService")

다음 행을 사용하면 angularjs 서비스에서 메서드를 실행하는 데 도움이 됩니다.

angular.element('*[ng-app]').injector().get("MyService").GetName ();

사용하는 유틸리티 방법은 다음과 같습니다.

function getService(name, element) {
    element = element || '*[ng-app]';
    return angular.element(element).injector().get(name);
}

getSrv("name-of_service", document.body)

언급URL : https://stackoverflow.com/questions/17319784/call-angularjs-service-from-simple-js-code

반응형