angularJS preventing click event in ng-file-upload

Question

I've read questions such as

• How to trigger ng-click [AngularJS] programmatically
• how can i trigger the click event of another element in ng-click using angularjs?

I've also read some other questions related. I'm a newbie in angularJS and very used to jQuery. I have triggered a click button event in another use case and worked just fine, but in this use case that uses the same ng-file-upload directive doesn't work.

Here's my JS

'use strict';

angular.module('waspPortalApp')
  .controller('UploadNotaFiscalCtrl', ['$scope', '$timeout', 'Session', 'RequisicaoService', 'AlertService', 
    function($scope, $timeout, Session, RequisicaoService, alertService) {

      var objetoPedido = {};

      $scope.idCia = Session.get().ciaUsuarioPK.idCia;

      $scope.uploadDeNotaFiscal = function() {
          var idPedido = parseInt($('#campoPedidoUploadNota').val());
          if (!$.isNumeric(idPedido) || idPedido < 1) {
              alertService.error('N&uacute;mero do pedido inv&aacute;lido', 'Por favor, informe o n&uacute;mero do pedido ou informe um n&uacute;mero de pedido v&aacute;lido.');
              return;
          }

          alertService.informativo('Recuperando informa&ccedil;&otilde;es do pedido', 'Por favor, aguarde enquanto recuperamos informa&ccedil;&otilde;es do pedido selecionado.');
          RequisicaoService.getRequisicaoPo({
              idCia: $scope.idCia,
              listaPedidos: idPedido,
              dataEmissaoPedidoDe: '',
              dataEmissaoPedidoAte: '',
              listaCnpj: ''
          },
          function (dados) {
              objetoPedido = JSON.parse(angular.toJson(dados))[0];
              if (objetoPedido.gnre) {
                  $('#modalInserirGNRE').modal('show');
              } else {
                  $('.botao-upload-nota-fiscal')[0].click();
              }
          },
          function (httpResponse) {
          });
        };

        $scope.upfiles = [{}];


      $scope.$watch('upfiles', function () {
          var file = $scope.upfiles[0];
          if (file.name === undefined) {
              return;
          }

          var valorGNRE = $('#campoGNRE').val() ? $('#campoGNRE').val().replace(/[^\d,]+/g, '').replace(',', '.') : '0.00';
          $('#campoGNRE').val('');

          $scope.upObj = RequisicaoService.uploadNotaFiscal($scope.idCia, $('#campoPedidoUploadNota').val(), file, valorGNRE)
                    .success(function (data, status, headers, config) {

            }
            ).error(function (data, status, headers, config) {

            });
      });
    }
  ]);

The HTML

<div class="panel panel-default" ng-controller="UploadNotaFiscalCtrl">
    <div style='position:inherit; margin-top:10px;'>
        <br>

        <div style='float:left;'>
            <label class="col-sm-4 control-label" title="Digite o n&uacute;mero do pedido" style='width: 75px; padding-top: 4px;' for="campoPedidoUploadNota">
                Pedido:
            </label>

            <input id="campoPedidoUploadNota" style="margin-left:10px; width:120px; height: 30px;" class="form-control" title="Digite o n&uacute;mero de Pedido" type="text">
        </div>
     </div>

     <div class="panel-footer text-right" style="margin-top: 50px;">
       <button type="button" class="btn btn-default" title="Upload de NF" ng-click="uploadDeNotaFiscal()"><i class="fa fa-upload">&nbsp;</i>Upload de NF</button>
     </div>
</div>

<div class="modal fade" id="modalInserirGNRE" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" ng-class="{'modal-sm': size == 'sm', 'modal-sm': size == 'sm'}">
        <div class="modal-content">
            <div class="modal-header panel-footer">
                <h3 class="panel-title">Informe o valor de GNRE:</h3>
            </div>
            <div class="form-group" style="height: 70px; max-height: 70px;">
              <label class="col-sm-12 control-label" style="margin-bottom: 10px; margin-top: 10px">
                  <div style="float: left; padding-bottom: 15px; padding-left: 1px; padding-right: 15px; padding-top: 15px;" class="modal-body">
                      <input id="campoGNRE" style="margin-left:1px; width:250px; height: 30px;" class="form-control" type="text" placeholder="Valor GNRE">
                  </div>
                  <div style='float:right;' class="modal-body text-right">
                      <button type="button" class="btn btn-default botao-upload-nota-fiscal" style="margin-left: 10px; padding-top: 4px; height: 30px; color: #FFFFFF; background-color: #5CB85C;" ng-file-select="upfiles" ng-model="upfiles" ng-multiple="false">Selecionar Nota Fiscal</button>
                  </div>
              </label>
            </div>
            <div class="modal-footer panel-footer"></div>
        </div>
    </div>
</div>

I have tried using $timeout as it was suggested in one of the answers in one of these related questions but still no luck. I have tried writing a directive as sugested in one of the answers too but still did not manage to succed.

Any ideas on what's wrong?

EDIT:

If I move $('.botao-upload-nota-fiscal').click() to outside the ajax request, the button get clicked. The problem now becomes that I don't actually have the object loaded and can't do the validation such as is done in the success handler.