angulaire.élément déclencheur d'événement click ne fonctionne pas

J'ai été d'essayer de déclencher un événement de clic dans mon élément d'entrée à l'aide d'un angulaires ng-cliquez sur un autre élément, comme ceci:

html

<div class="myClass" ng-click="vm.selectImage()" nv-file-drop uploader="vm.uploadImage">
    Drop your image here
</div>
<div ng-hide="!hideInput">
    <input type="file" id="imgSelect" nv-file-selec uploader="vm.uploadImage" />
</div>

controller

vm.selectImage= selectImage;
function selectImage() {
    angular.element('#imgSelect').trigger('click');
};

Je sais il y a d'autres questions similaires, mais j'ai essayé d'utiliser ce qu'ils ont dit (qui a un tas d'entre eux montre le même code que j'utilise), par exemple:

Mais même avec ça, ou même à l'aide d'une directive comme ceci:

.directive('selectImg', selectImg);
function selectImg() {
    return {
        restrict: 'A',
        link: function(scope, element) {
            element.bind('click', function(e) {
                //option 1
                angular.element(e.target).siblings('.imgSelect').trigger('click');

                //option 2
                angular.element( document.querySelector( '#imgSelect' ) ).trigger('click');

                //option 3
                var myEl = angular.element( document.querySelector( '#imgSelect' ) );
                myEl.trigger('click');

                //option 4
                angular.element('#imgSelect').trigger('click'); //angular way
            });
        }
    };
};

Je reçois cette erreur:

Erreur: [jqLite:nosel] http://errors.angularjs.org/1.5.0-beta.1/jqLite/nosel

Ici est un plunker pour démontrer l'erreur: http://plnkr.co/edit/rWcCbixwFArYhCxUVTsv?p=preview

Quel est le problème?

  • S'il vous plaît créer un plunkr qui illustre le problème
  • J'ai mis à jour ma question avec un plunker.
  • Le problème est que vous ne le faites pas Angulaire façon, donc il n'est pas surprenant qu'il ne fonctionne pas. Toutes les versions ne sont pas fiables, parce qu'ils tentent de traiter avec le DOM qui n'est pas dans la directive cadre, de sorte que le modèle est susceptible de ne pas être dans les DOM lorsque vous essayez de l'utiliser.
  • angulaire.élément() n'a pas de méthode trigger (). docs.angularjs.org/api/ng/function/angular.element
  • supprimer les sélecteurs, ou ajouter jquery,jqury lite ne supporte pas les sélecteurs
  • Alors pourquoi les autres réponses dites de le faire, et sont-ils acceptables? Ou, comment dois-je faire avec AngularJs? Je n'ai pas de plans pour insérer jQuery dans mon projet.

InformationsquelleAutor celsomtrindade | 2015-11-28
  1. 5

    ok mise à jour de ma réponse, cela fonctionne.Il semble que vous avez à sortir de l'actuelle $apply() cycle. Une façon de faire cela est d'utiliser $timeout()

    setTimeout(function() {
    document.getElementById('imgSelect').click()        
 }, 0);

    vérifier la réponse D'entrée de déclenchement fichier cliquez sur l'événement en AngularJS

    • Il n'y a plus d'erreurs dans la console. Mais ne faut-il pas ouvrir l'entrée pour ajouter un fichier?
    • mise à jour de ma réponse
    • Merci sr! Maintenant ça fonctionne.
    InformationsquelleAutor Mat.