javaScript function does not work when used ng-include angularJs

Question

javaScript function does not work when used ng-include angularJs

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I'm doing a tamplate injection via% of angles. Inside this template I have a button that calls a modal which is inserted in the template by another injection. Until then everything works correctly. Within the modal I have some inputs and a button that should insert the information in the listing, but this is what does not work. It calls the right function, passes the values but does not enter the listing. Let's look at the code.

app.controller("notasFiscaisProdutorLiquidacaoController", function($scope,$rootScope,$timeout){

    jQuery(document).ready(function(){
        jQuery("#btnAbrirModalNota").click(function(){
            jQuery("#modalAdicionarProduto").modal();
        });

        jQuery("#btnAbrirModalNotaLiquidacao").click(function(){
            jQuery("#modalAdicionarNotaLiquidacao").modal();
        });

    });

    $scope.etapa=1;
    $scope.primeiraEtapa='./arrecadacao/producaoPrimaria/producaoPrimariaPaginas/notasFiscais/primeiraEtapa.html'
    $scope.segundaEtapa='./arrecadacao/producaoPrimaria/producaoPrimariaPaginas/notasFiscais/segundaEtapa.html'
    $scope.terceiraEtapa='./arrecadacao/producaoPrimaria/producaoPrimariaPaginas/notasFiscais/terceiraEtapa.html'

    $scope.proximaEtapa = function () {
        $scope.etapa++;
    }
    $scope.anterior = function () {
        $scope.etapa--;
    }


    $scope.notas=[];
    $scope.nota={};
    $scope.nota.flagARendimento="0";
    $scope.tipoNota="0";

    $scope.adicionarNota = function (fechar) {
        $scope.notas.push($scope.nota);
        $scope.nota={}
        if (fechar) {
            $('#modalAdicionarProduto').modal('hide');
        }
    };

});

Main Html

<html>
<meta charset="UTF-8"/>
<base href="/"></base>

<body>
<div ng-controller="notasFiscaisProdutorLiquidacaoController" class="voltar">
    <div class="col-md-12 " >
        <div ng-if="etapa==1" ng-include="primeiraEtapa"></div>
        <div ng-if="etapa==2" ng-include="segundaEtapa"></div>
        <div ng-if="etapa==3" ng-include="terceiraEtapa"></div>
        <div class="row">
            <div class="col-md-12 ">
                <div class="pull-right">
                    <button style="color: black;" type="button" ng-click="anterior()" ng-disabled="etapa==1" class="btn btn-default btnFiscal" id="btnVoltar">Voltar </button>
                    <button style="color: black;" type="button" ng-click="proximaEtapa()" ng-disabled="etapa==3"class="btn btn-default btnFiscal" id="btnProximo">Próximo </button>
                </div>

            </div>
        </div>
    </div>
</div>
</body>
</html>

Template html

<div ng-controller="notasFiscaisProdutorLiquidacaoController" class="panel panel-primary container" id="containerEscolherEntidade">
    <div class="panel-heading container">Primeira etapa</div>

    <form novalidate name="frmNotasMultiplas" id="formCadastro1" role="form">
        <div class="row">
            <div  class="col-md-12">

                <div class="row">
                    <div  class="col-md-12">
                        <div  class=" form-group col-md-3">
                            <label class="lb">Data emissão</label> <input ng-required="nota.idSituacao==1" type="date" class="form-control" ng-model="nota.dataEmissao" date-format />
                        </div>

                        <div  ng-show="tipoNota==0" class=" form-group col-md-3">
                        <label class="lb">Série</label>
                        <input ng-required="true" maxlength="3" type="text" class="form-control"
                              ng-model="nota.serie" />
                    </div>                
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-md-12">
                        <div ng-show="tipoNota==1" class=" form-group col-md-12 ">
                            <button type="button" id="btnAbrirModalProduto" class="btn btn-default" >Adicionar Produto </button>
                        </div>
                    </div>
                </div>

                <div ng-show="tipoNota==1" class=" form-group col-md-12 ">
                    <table class="table table-bordered">
                        <thead>
                        <tr class="lb">
                            <th>Tipo</th>
                            <th>Série</th>
                            <th>Número</th>
                            <th>Opções</th>
                        </tr>
                        </thead>
                        <tbody ng-repeat="not in notas track by not.tipo">
                        <tr class="lb">
                            <td>{{not.tipo}}</td>
                            <td>{{not.serie}}</td>
                            <td>{{not.numero}}</td>
                        </tr>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </form>
    <div ng-include="'./arrecadacao/producaoPrimaria/producaoPrimariaPaginas/notasFiscais/modalAdicionarProdutoNota.html'"></div>
    <div ng-include="'./arrecadacao/producaoPrimaria/producaoPrimariaPaginas/notasFiscais/modalAdicionarProdutoNotaLiquidacao.html'"></div>

</div>

modal

<html>
<div  ng-controller="notasFiscaisProdutorLiquidacaoController">
<div class="modal fade" data-backdrop="static" data-keyboard="false" id="modalAdicionarProduto" role="dialog">
    <div class="modal-dialog modal-lg">
        <br> <br> <br> <br>
        <div class="modal-content" >
            <div style="color: black; background-color: rgb(220, 220, 220);" class="modal-header">
                <button type="button" class="close" data-dismiss="modal" ng-click="limpaModalContadores()" >&times;</button>
                <h3>Produto</h3>
            </div>
            <div class="modal-body">
                <form novalidate name="frmNota" id="formCadastro" role="form">
                    <div class="row">
                        <div class='col-md-6' >
                            <label class="lb">Tipo</label>
                            <input type='text' class="form-control"  ng-model="nota.tipo" style="width: 100%"/>
                        </div>
                        <div class="col-md-3" >
                            <label class="lb">Série</label>
                            <input   type="text" class="form-control" ng-model="nota.serie"  />
                        </div>
                        <div class="col-md-3" >
                            <label class="lb">Número</label>
                            <input   type="text" class="form-control" ng-model="nota.numero"  />
                        </div>

                    </div>
                </form>
            </div>
            <div class="modal-footer" style="background-color: rgb(220, 220, 220);">
                <button style="color: black;" type="button" class="btn btn-default btnSalvar1" id="btnSalvarRegistro" ng-click="adicionarNota(true)">Adicionar</button>
                <button style="color: black;" type="button" class="btn btn-default btnSalvar1" ng-click="adicionarNota(false)" id="btnSalvarModal" >Adicionar e novo</button>
                <button style="color: black;" type="button" class="btn btn-default btnCancelar closed" ng-click="limpaModalAdicionarNotas()" data-dismiss="modal">Cancelar</button>
            </div>
        </div>
    </div>
</div>
</div>
</html>

javascript angularjs

asked by anonymous 20.07.2018 / 13:41

2 answers

How to get specific return data from a JSON with Ionic 3 parent :: method does not return connection

score 1 · Answer 1

You are cleaning the object $scope.nota with $scope.nota={} .

Try pushing with copy like this:

$scope.notas.push(angular.copy($scope.nota));

I noticed that you only display the listing if tipoNota==1 , I do not see at any time you assigning typeNote to 1, it is always 0.

score 0 · Answer 2

In all templates (main, template and modal) the controller notasFiscaisProdutorLiquidacaoController is added. For angular, every time you add a controller in ng-controller a new instance is created. Maybe in this case, your script is trying to access a variable that is in another scope (another instance), here is an example of a controller added twice in a template:

angular.module('teste',[]);
var test = angular.module('teste');
angular.module('teste').controller('testCtrl', function($scope){
  $scope.someModel = {'value': 0}
  console.log('new instance');
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><bodyng-app="teste">
    <div>
      <div ng-controller="testCtrl">
          <input type="number" ng-model="someModel.value">
          <p></p>value in controller: {{someModel.value}}</p>
       </div>
       <div ng-controller="testCtrl">
          <input type="number" ng-model="someModel.value">
          <p></p>value in controller: {{someModel.value}}</p>
       </div>
    </div>
  </body>