angularjs добавить новую зависимость

Question

Я хочу добавить новую зависимость, зависимость от углового файла-upload, но что бы я ни делал, мое приложение вылетает, я не могу понять, как это работает. То, что у меня сейчас:

в app.js

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

в appController.js

myApp.controller('appCtrl', ['$scope', function ($scope) { 

Я получил все необходимые файлы ресурсов (угловато-файлов upload.js) и ссылки на них, я просто не знаю, как правильно вводить новую зависимость. Я думаю, мне нужно только отредактировать две предоставленные строки, или мне нужно создать совершенно новый контроллер, и если да, то как это будет выглядеть?

В нем говорится, что мой вопрос является возможным дубликатом другого, но по другому вопросу речь идет о введении зависимостей в config(), это не так.

Answer 1

Предполагая, что вы имеете в виду этот проект: https://github.com/danialfarid/ng-file-upload
затем snytax таков:

var myApp = angular.module('myApp', ['ui.bootstrap', 'angularFileUpload']); 

myApp.controller('appCtrl', ['$scope', 'FileUploader', function ($scope, FileUploader) { 
}]); 

Answer 2

Вы должны написать его, как следующее:

var myApp = angular.module('myApp', ['ui.bootstrap', 'angular-file-upload']); 

Вот и все. Модуль зависимости должен работать нормально.

Answer 3

В следующем примере описывается, как вводить материал, который вы хотите использовать. Именно из here

//inject angular file upload directives and services. 
var app = angular.module('fileUpload', ['ngFileUpload']); 

app.controller('MyCtrl', ['$scope', 'Upload', function ($scope, Upload) { 
            ^^^^^^^^     ^^^^^^ 
    $scope.$watch('files', function() { 
     $scope.upload($scope.files); 
    }); 

    $scope.upload = function (files) { 
     if (files && files.length) { 
      for (var i = 0; i < files.length; i++) { 
       var file = files[i]; 
       Upload.upload({ 
        url: 'upload/url', 
        fields: {'username': $scope.username}, 
        file: file 
       }).progress(function (evt) { 
        var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
        console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name); 
       }).success(function (data, status, headers, config) { 
        console.log('file ' + config.file.name + 'uploaded. Response: ' + data); 
       }).error(function (data, status, headers, config) { 
        console.log('error status: ' + status); 
       }) 
      } 
     } 
    }; 
}]); 

Answer 4

Вы должны добавить файл в angular.module:

var myApp = angular.module('myApp', ['ui.bootstrap', 'angular-file-upload']); 

и импортировать файл (например, в вашем index.html):

<script src="yourpath/ui-bootstrap-tpls.js"></script> 
<script src="yourpath/angular-file-upload.js"></script> 

Если вы правильно установите свою зависимость, она должна работать :)

Answer 5

Добавить зависимость от углового экземпляра

var myApp = angular.module('myApp', ['ui.bootstrap', 'angularFileUpload']); 

И добавить в контроллер:

myApp.controller('appCtrl', ['$scope', 'FileUploader', function($scope, FileUploader) { 

Смотрите пример на их Гит странице https://github.com/nervgh/angular-file-upload/blob/master/examples/simple/controllers.js

Answer 6

Из angular-file-upload вики:

• Добавьте зависимость в вашем объявлении модуля, они будут все угловые модули потребностей приложения.

var myApp = angular.module('myApp', ['ui.bootstrap', 'angularFileUpload']);

• Чтобы использовать его компоненты в вашем контроллере вы будете иметь также вводить FileUploader, так что вы можете получить доступ к его API.

myApp.controller('appCtrl', ['$scope', 'FileUploader', function ($scope, FileUploader) {

Answer 7

Вам нужны следующие способы.

Если у вас есть файл FileUploader.js

• отслеживать файлы в вашей основной HTML страницы после angular.js сценария до main.js (app.js)

• Затем настройте его этим способ

  var myApp = angular.module('myApp', ['ui.bootstrap', 'fileUpload']); myApp.controller('appCtrl', ['$scope', 'fileUpload', function ($scope, fileUpload) {
// Your code }]);

Если у вас есть сомнения, пожалуйста, ознакомьтесь с этой дискуссией: - Injecting Dependencies in config() modules - AngularJS