Modal 요소에서 Angular JS $ 파일을 가져올 수 없습니다

Question

사용자가 사이트에 업로드 할 파일을 선택하라는 메시지를 표시하는 모달 요소를 사용하고있어 파일을 가져올 수 없습니다. 여기 내 HTML입니다 :

<div class="modal-section align-left"> 
     <input type="file" accept='application/pdf' ng-file-select="onFileSelect($files)" file></input> 
</div> 

여기에 내가 얻을하는 데 사용할 노력하고있어 자바 스크립트입니다 : 그것은 충분히 간단한 작업이 될해야처럼

$scope.onFileSelect = ($file); 

것 같다하지만 뭔가 연결되지 그리고 나는 무엇이 확실하지 않다. '$ file is not defined'오류가 계속 발생합니다.

어떤 생각이 도움이 될 것입니다! 감사!

여기에 찾을 수있는 git hub에서 cheynewallace의 코드를 사용하고 있다는 사실을 깨달았습니다. https://github.com/cheynewallace/angular-s3-upload Amazon Web Services에 선택한 파일을 보내려는 모달 요소를 얻으려고 시도합니다. 그가 작동하도록 한 버전이 있는데 어떤 이유로 든 모달 요소로 작동하지 못합니다.

Answer 1

두 지시어가 섞여있는 것 같습니다. ng-file-select는 danialfarid's angular-file-upload에서 왔고 파일 지시문은 언급 한 cheynewallace's example에서 왔습니다.

cheynewallace 's에 가면, 위의 링크 된 지시어가 누락 된 것일 수 있습니다. 코드를 살펴보면, 지시문은 하나의 파일 업로드 만 지원하고 파일을 $ scope.file 변수로 설정합니다. 그의 예를 들어, 그는 사용 후 당신이 당신의 입력에서 file 속성을 제거 할 수

app.controller('myController', function($scope) { 
    $scope.upload = function() { 
     // do something with $scope.file 
    }; 
}); 

당신이 danialfarid의 지시로가는 경우 :

<input type="file" file></input> 
<a class="btn btn-primary btn-block btn-lg" ng-click="upload()">Upload</a> 

컨트롤러 이런 식으로 뭔가 할 필요가있다. 이것은 당신을 떠날 것이다 :

<input type="file" accept='application/pdf' ng-file-change="onFileSelect($files)"></input> 

그리고 컨트롤러는 다음과 같이 볼 필요가있다 :

app.controller('myController', function($scope) { 
    $scope.onFileSelect = function($files) { 
     // do something with $files 
    }; 
}); 

나는이 두 가지 방법을 테스트하지 않은 경고를,하지만 난 하나가 당신을 얻을 것으로 예상 라이트 트랙.

---

업데이트

Here's a working plunk. 위의 코드를 사용하여 구체적인 예제를 작성했지만 ng-file-change에 대한 첫 번째 스 니펫이 잘못되었습니다. 처음에는 당신이 가진 것처럼 ng-file-select이었을 것입니다. plunk는 두 가지 지시어를 모두 보여줍니다. 또한 danialfarid 예제에 ng-multiple='true' 속성을 추가하여 여러 파일을 선택할 수 있도록했습니다.