How to pass parameters in function executed via ng-click when it is in a list of buttons?

0

Using the IONIC framework I have the following situation, in an index.html there is a list of input type items where they will be informed by the user of their respective username, email and password and in a certain button type submit is called the function savePerson (register) passing the register parameter that should contain the information entered by the user to save the record, however in the App.js responsible for controlling this operation, the registry parameter arrives invalid in the savePerson function.

Can anyone tell me how I can solve this problem in this scenario?

Below are the snippets of the

INDEX.HTML

<ion-pane class="login-custom">
  <ion-content>
    <h1>Minha Pelada <span>picapau amarelo(domingo)</span></h1>
    <ion-list class= "list-inset">
      <ion-item class= "item-input">
        <i class= "icon ion-ios-person-outline placeholder-icon"></i>
        <input type= "text" name="username" class="form-control" ng-model="cadastro.username" id="username" placeholder= "username">
      </ion-item>
      <ion-item class = "item-input">
        <i class = "icon ion-ios-email-outline placeholder-icon"></i>
        <input type = "text" name="email" class="form-control" ng-model="cadastro.email" id="email" placeholder= "email">
      </ion-item>
      <ion-item class = "item-input">
        <i class = "icon ion-ios-locked-outline placeholder-icon"></i>
        <input type = "password" name="senha" class="form-control" ng-model="cadastro.senha" id="senha" placeholder= "senha">
      </ion-item>
      <ion-item class= "item-button button-first">
        <button type="submit" class= "button button-block button-calm" ng-click="savePerson(cadastro)"> Criar conta</button>
       </ion-item>
        <button class= "button button-block icon-left ion-social-facebook button-positive"> Entrar com Facebook </button> 
      </ion-item>
      <ion-item class= "item-button">
        <button class= "button button-block button-clear"> Já tem uma Conta? Clique aqui para Entrar em MinhaPelada </button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-pane>

APP.JS

  $scope.savePerson = function(params) {
    alert('Usuário Informado: ' + params.username + ' Senha Informada: ' + params.senha );
    var PeopleObject = Parse.Object.extend("PeopleObject");
    var person = new PeopleObject();
    person.set("username", username);
    person.set("senha", senha);
    person.save(null, {});
};
ERROR REPORTED BY BROWSER GOOGLE CHROME CONSOLE
TypeError: Cannot read property 'username' of undefined
    at ChildScope.$scope.savePerson (app.js:34)
    at fn (eval at compile (ionic.bundle.js:27643), <anonymous>:4:300)
    at ionic.bundle.js:65429
    at ChildScope.$eval (ionic.bundle.js:30400)
    at ChildScope.$apply (ionic.bundle.js:30500)
    at HTMLButtonElement.<anonymous> (ionic.bundle.js:65428)
    at defaultHandlerWrapper (ionic.bundle.js:16792)
    at HTMLButtonElement.eventHandler (ionic.bundle.js:16780)
    at triggerMouseEvent (ionic.bundle.js:2953)
    at tapClick (ionic.bundle.js:2942)
(anonymous) @ ionic.bundle.js:26799
(anonymous) @ ionic.bundle.js:23512
$apply @ ionic.bundle.js:30505
(anonymous) @ ionic.bundle.js:65428
defaultHandlerWrapper @ ionic.bundle.js:16792
eventHandler @ ionic.bundle.js:16780
triggerMouseEvent @ ionic.bundle.js:2953
tapClick @ ionic.bundle.js:2942
tapTouchEnd @ ionic.bundle.js:3069
    
asked by anonymous 02.03.2017 / 00:54

2 answers

0

The attribute params function savePerson is as undefined , params is a reference to the object cadastro you pass ng-click="savePerson(cadastro)" so cadastro is undefined .

The error

The error is because you are trying to access attributes of an object that has not been created.

Solution:

In the controller at app.js start the object cadastro :

$scope.cadastro = {};
    
02.03.2017 / 01:10
0

Glauber, I discovered the reason for the new error, it was the region where the registration object was started, I put it in the wrong place, I changed it and now the system already recognizes the parameters passed in the registration object. Many thanks for your tip! Here is the corrected code snippet below:

example.controller("ExampleController", function($scope) {

      $scope.cadastro = {};

      $scope.savePerson = function(cadastro) {

        alert('Usuário Informado: ' + cadastro.username + ' Senha Informada: ' + cadastro.senha );

        var PeopleObject = Parse.Object.extend("PeopleObject");
        var person = new PeopleObject();

        person.set("username", cadastro.username);
        person.set("senha", cadastro.senha);
        person.save(null, {});

      };
    
02.03.2017 / 14:53