2016-05-18 4 views
0

Я сталкиваюсь с чем-то немного странным. Ну, по крайней мере, для моего понимания.Проблема с кнопкой ng-click

Позвольте мне дать вам фрагмент кода, так что вы можете увидеть, что я делаю

var app = angular.module('riskQueries', []); 
 
    
 
app.controller('cuitCtrl',function ($scope, $window) { 
 
    
 
    $scope.defaultCuit = '--Inserte su CUIT aquí--'; 
 
    
 
    $scope.riskData = { 
 
     cuit: null 
 
    }; 
 
    
 
    $scope.reset = function() { 
 
     $scope.riskData.cuit = angular.copy($scope.defaultCuit); 
 
     $window.alert('Hey! You clicked!'); 
 
    }; 
 
    $scope.reset(); 
 
    $scope.comboData = { 
 
     planAnterior: null, 
 
     planSolicitado: null, 
 
     options: [ 
 
      {id: 0, name: "No tengo un plan"}, 
 
      {id: 1, name: "Plan Básico"}, 
 
      {id: 2, name: "Plan Joven"}, 
 
      {id: 3, name: "Plan Famliar"}, 
 
      {id: 4, name: "Plan Cobertura Completa"}, 
 
      {id: 5, name: "Plan Plus"} 
 
     ], 
 
    }; 
 
    
 
}); 
 

 
app.filter('selectedPlan',function(){ 
 
    return function(planSolicitado,planAnterior){ 
 
     planAnterior <= planSolicitado; 
 
    }; 
 
});
input[type=text], select { 
 
    width: 100%; 
 
    padding: 12px 20px; 
 
    margin: 8px 0; 
 
    display: inline-block; 
 
    border: 1px solid #ccc; 
 
    border-radius: 4px; 
 
    box-sizing: border-box; 
 
    font-family: "Verdana", sans-serif; 
 
} 
 

 
.submit { 
 
    align-content: center; 
 
    width: 30%; 
 
    background-color: #71b9fb; 
 
    color: white; 
 
    padding: 14px 20px; 
 
    margin: 8px 0; 
 
    border: none; 
 
    border-radius: 4px; 
 
    cursor: pointer; 
 
    font-family: "Verdana", sans-serif; 
 
} 
 

 
.submit:hover { 
 
    background-color: #c4e3ff; 
 
} 
 

 
.form { 
 
    width: 45%; 
 
    border-radius: 5px; 
 
    border-style: solid; 
 
    border-color: darkblue; 
 
    border-width: thick; 
 
    background-color: #FFFFFF; 
 
    padding: 40px; 
 
    font-family: "Verdana", sans-serif; 
 
} 
 

 
.header { 
 
    border-bottom-style: groove; 
 
    border-bottom-color: #9BE5F4; 
 
    border-bottom-width: thick; 
 
    width: 50.5%; 
 
} 
 

 
.header .logo{ 
 
    max-width: 25%; 
 
    height: auto; 
 
    display: block; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
}
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
 
    <script src="logic.js"></script> 
 
    <link rel="stylesheet" type="text/css" href="style.css"> 
 

 
<body> 
 
    <div class="header"> 
 
     <img class="logo"> 
 
    </div><br> 
 
    <div class="form" ng-app="riskQueries" ng-controller="cuitCtrl"> 
 
     <form name="BPMForm"> 
 
      <label for="Cuit">CUIT/CUIL:</label> 
 
      <input name="Cuit" type="text" ng-model="riskData.cuit"><br><br> 
 
      <label for="PlanAnterior">Plan Actual:</label> 
 
      <select name="PlanAnterior" id="PlanAnterior" ng-model="comboData.planAnterior" ng-options="option.name for option in comboData.options"> 
 
       <option value="">---Seleccione su plan Actual---</option> 
 
      </select><br><br> 
 
      <label for="PlanSolicitado">Plan Solicitado:</label> 
 
      <select name="PlanSolicitado" id="PlanSolicitado" ng-model="comboData.planSolicitado" ng-options="option.name for option in comboData.options | filter: {id: '!' + comboData.planAnterior.id}"> 
 
       <option value="">---Seleccione su plan a Solicitar---</option> 
 
      </select><br><br> 
 
      <button class="submit" ng-click="reset()">Limpiar</button> 
 
     </form> 
 
     <p>resultados: WebService: {{riskResponse}} - cuit: {{riskData.cuit}} - planAnteior: {{comboData.planAnterior.id}} - planSolicitado: {{comboData.planSolicitado.id}}</p> 
 
    </div> 
 
</body>

Если вы запустите его, вы можете увидеть, что окно предупреждения определяется в функции I» ve, созданный для моей кнопки, активируется без меня, щелкнув по нему. Я думаю, что это может быть связано с тем, что я объявляю ng-app и ng-controller, но не нашел что-то полезное.

Что мне здесь не хватает?

ответ

0

Я предполагаю, что вы пытаетесь вызвать функцию reset(), правильно? Кажется, вы вызвали его сразу после объявления его на контроллере.

$scope.reset = function() { 
     $scope.riskData.cuit = angular.copy($scope.defaultCuit); 
     $window.alert('Hey! You clicked!'); 
    }; 
    $scope.reset(); // <--- You're calling it here 
    $scope.comboData = { 

Удалить значение $ scope.reset(); от вашего контроллера, и вам должно быть хорошо идти :)

+0

Глупый я ... вы были правы! Спасибо! –

+0

Случается всем :) –

Смежные вопросы