Angular.js - $ scope를 jQuery 함수에 전달합니다.

Angular.js를 통해 jQuery File Uploader를 사용하고 있습니다. 의 '랜드 마크'속성을 읽을 수 없습니다 : 나는 각도 $ 범위로 이미지 업로드에서 서버의 응답을 전달해야합니다,하지만 난 done 함수 내에서 $ 범위를 액세스 할 수 없습니다

function LandmarkNewCtrl($location, $scope, db) { 
     $('#fileupload').fileupload({ 
     url: '/api/upload', 
     dataType: 'text', 
     done: function (e, data) { 

      $scope.landmark.avatar = data.result; 

     } 
     }); 
    }

"확인되지 않은 유형 정의되지 않은 "오류가 발생합니다.

$ scope를 done: function()에 어떻게 전달합니까?

출처

2013-07-30 alyx

그건 더는

이

출처

2013-07-30 20:12:00 massintha

당신은 각 컨트롤러에 HTML에 액세스하지 않아야 작동합니다

angular.element('#fileupload').fileupload({ 
    url: '/api/upload', 
    dataType: 'text', 
    done: function (e, data) { 

     $scope.landmark.avatar = data.result; 

    } 
    });

그런 짓을하는 것이 좋습니다. 당신은 당신이 원하는 것을 할 수있는 지시어를 사용한다 :

angular.module('yourModule').directive('fileupload', function() { 
    return function($scope, $element) { 
    $element.fileupload({ 
     url: '/api/upload', 
     dataType: 'text', 
     done: function (e, data) { 

     $scope.landmark.avatar = data.result; 
     $scope.$apply(); 
     } 
    }); 
    } 
});

완료 함수는 jQuery를에 의해 트리거됩니다 당신이 $의 sope를 수행 할 필요가 그래서 $이 (적용), 범위 바인딩을 새로 각도 강제로..

다음 템플릿에서이 지시어를 사용

<div ng-app="yourModule"> 
    <div fileupload>Fileupload</div> 
</div>

더 많은 정보를 JQuery와 구성 요소를 포장에 :이 각도 사용하여 호출되었지만 Beginner questions with AngularJS and directives - wrapping a jQuery component

출처

2013-07-30 20:30:15

은 $ 범위가 JQuery와 함수 내에서 작동하지 않습니다. 엘리먼트는 keddour의 대답에서 제안했다.

지시문을 사용하여 함수를 호출하면 유효한 대답 인 것 같습니다.

특별한 상황 (예 : 동적으로로드 된 스크립트)에서보다 간단한 방법을 사용하려는 사람들은 전역 변수를 통해 데이터를 교환하는 작업도 마찬가지입니다. 이것은 몇몇 규칙을 어기는데 - 그러나 Angular는 아직 완벽하지 못하며 때로는 해결 방법 문제에 이상한 방법을 사용해야합니다.

전역 범위에서 이와 같이 선언하십시오.

angularBridge = {};

은 이제 컨트롤러 (I 동적 스크립트에서 가정) :

demoApp.controlProvider.register('demoController', ['$scope', function($scope) {   

angularBridge.$demoScope = $scope; 

$scope.landmark.avatar = 0;  

}]);

는 이제 데이터를 교환 할 수 측면에서 각도 컨트롤러 또는 JQuery와 기능이 사용할 수 있습니다.

function LandmarkNewCtrl($location, $scope, db) { 
     $('#fileupload').fileupload({ 
     url: '/api/upload', 
     dataType: 'text', 
     done: function (e, data) { 

      angularBridge.$demoScope.landmark.avatar = data.result; 

     } 
     }); 
    }

출처

2015-09-17 07:08:33

Angular.js - $ scope를 jQuery 함수에 전달합니다.

답변

관련 문제