2014-12-27 2 views
0

세미콜론처럼 어리석은 일이라면 미리 사과하지만, 컨트롤러를 인식하는 데 어려움을 겪고 있습니다.각도 js가 컨트롤러를 인식하지 못합니다.

이미지 컨트롤러가 정의되지 않았습니다.

참고 : 각도 파일 업로드 플러그인을 사용하고 있으며이 파일은 웹 API 2.0 응용 프로그램입니다.

나는이 자바 스크립트 파일 UniqueAPIStart, UniqueAPIImages

UniqueAPIStart가 (고정)이 있습니다

var UniqueAPI = angular.module('UniqueAPI', ['angularFileUpload']); 

UniqueAPIImages (고정) : 다음

UniqueAPI.controller('ImageController', ['$scope', '$upload', function ($scope, $upload) { 
    $scope.$watch('myFiles', function() { 
     for (var i = 0; i < $scope.myFiles.length; i++) { 
      var file = $scope.myFiles[i]; 
      $scope.upload = $upload.upload({ 
       url: '/api/AdminImages', // upload.php script, node.js route, or servlet url 
       //method: 'POST' or 'PUT', 
       //headers: {'Authorization': 'xxx'}, // only for html5 
       //withCredentials: true, 
       data: { myObj: $scope.myModelObj }, 
       file: file, // single file or a list of files. list is only for html5 
       //fileName: 'doc.jpg' or ['1.jpg', '2.jpg', ...] // to modify the name of the file(s) 
       //fileFormDataName: myFile, // file formData name ('Content-Disposition'), server side request form name 
       // could be a list of names for multiple files (html5). Default is 'file' 
       //formDataAppender: function(formData, key, val){} // customize how data is added to the formData. 
       // See #40#issuecomment-28612000 for sample code 

      }).progress(function(evt) { 
       console.log('progress: ' + parseInt(100.0 * evt.loaded/evt.total) + '% file :' + evt.config.file.name); 
      }).success(function(data, status, headers, config) { 
       // file is uploaded successfully 
       alert('file ' + config.file.name + 'is uploaded successfully. Response: ' + data); 
      }).error(function (data, status) { 
       alert(data.error); 
      }); 
    //.then(success, error, progress); // returns a promise that does NOT have progress/abort/xhr functions 
    //.xhr(function(xhr){xhr.upload.addEventListener(...)}) // access or attach event listeners to 
    //the underlying XMLHttpRequest 
} 
     /* alternative way of uploading, send the file binary with the file's content-type. 
      Could be used to upload files to CouchDB, imgur, etc... html5 FileReader is needed. 
      It could also be used to monitor the progress of a normal http post/put request. 
      Note that the whole file will be loaded in browser first so large files could crash the browser. 
      You should verify the file size before uploading with $upload.http(). 
     */ 
     // $scope.upload = $upload.http({...}) // See 88#issuecomment-31366487 for sample code. 

    }); 
}]); 

그리고 내 cshtml :

@section scripts 
{ 
    <script type="text/javascript" src ="/Scripts/API/ImageController.js"></script> 
} 

<div class="container" ng-app="UniqueAPI"> 
    <div class="row"> 
     <div class="col-md-4" ng-controller="ImageController"> 
      <form action="javascript:void(0);"> 
       <div class="form-group"> 
        <label for="imgDescription">Email address</label> 
        <input type="text" class="form-control" id="imgDescription" placeholder="Image Description"> 
        <button ng-file-select ng-model="files" multiple="true">Attach Any File</button> 
        <div ng-file-drop ng-model="files" class="drop-box" 
         drag-over-class="{accept:'dragover', reject:'dragover-err', delay:100}" 
         multiple="true" allow-dir="true" accept="image/*"> 
         Drop Images here 
        </div> 

       </div> 
      </form> 
     </div> 

    </div> 
</div> 

LayoutFile :

<script src="https://angular-file-upload.appspot.com/js/angular-file-upload-shim.js"></script> 
<script src="https://angular-file-upload.appspot.com/js/angular-file-upload.js"></script> 

과 : 당신이 필요한 라이브러리 가져 오기를 참조하십시오 could't 모든

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>@ViewBag.Title</title> 

    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> 


    @Styles.Render("~/Content/css") 
    @Scripts.Render("~/bundles/modernizr") 

</head> 
<body> 
    <div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="container"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 
       @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" }) 
      </div> 
      <div class="navbar-collapse collapse"> 
       <ul class="nav navbar-nav"> 
        <li>@Html.ActionLink("Home", "Index", "Home", new { area = "" }, null)</li> 
        <li>@Html.ActionLink("API", "Index", "Help", new { area = "" }, null)</li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div class="container body-content"> 
     @RenderBody() 
     <hr /> 
     <footer> 
      <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p> 
     </footer> 
    </div> 

    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script> 

    <script type="text/javascript" src="~/Scripts/angular-file-upload-all.js"></script> 
    <script type="text/javascript" src="~/Scripts/angular-file-upload-shim.js"></script> 
    <script type="text/javascript" src="~/Scripts/angular-file-upload.js"></script> 
    <script type="text/javascript" src="~/Scripts/API/UniqueAPIStart.js"></script> 
    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/bootstrap") 
    @RenderSection("scripts", required: false) 
</body> 
</html> 
+2

같은 ...'var에 UniqueAPI = angular.module ('UniqueAPI', [])이어야한다' 와 'angular.module ('UniqueAPI ', ['angularFileUpload '])' – PSL

+0

당신은 어디에서 fileUpload 라이브러리를 가져오고 있습니까? angular-file-upload-shim.js 및 angular-file-upload.js – nanndoj

+0

@PSL 고마워, 고칠 수 있었다. 문제가 여전히 발생합니다 –

답변

1

첫째. 당신은 두 번 모듈을 만드는 :

var UniqueAPI = angular.module('UniqueAPI', []); 
angular.module('UniqueAPI', ['angularFileUpload']); 

그것은 당신은 모듈을 재현하는이

var UniqueAPI = angular.module('UniqueAPI', ['angularFileUpload']); 
+0

고맙습니다. 수정 프로그램을 만들었지 만 var UniqueAPI를 시작 js에 추가하는 것을 잊어 버렸습니다. –

관련 문제