how to pass parameter to another screen with ionic1 and angular1?

Question

I created a screen with several buttons very similar to this :

https://plus.google.com/+JoshuaMorony/posts/Rjhs4RCwek3

When I click on a button it would have an id and this id I get on its route, I did with list already, but several buttons passing parameter still could not.

My question is how to pass this button id to another screen.

Warnings.html

<ion-view view-title="Avisos">
  <ion-content style="background-color: #FF4500; background-size: cover;
     background-position: center;">
    <div class="row icon-row">
            <div class="col text-center">
              <button class="botao button button-positive" id="1">Icon</button>
              <br>mais informaçoes
            </div>
            <div class="col text-center">
              <button class="botao button button-positive" id="2">Icon</button>
              <br>Avisos
            </div>
            <div class="col text-center ">
              <button class="botao button button-positive" id="3">Icon</button>
              <br>Contato
            </div>
    </div>
  </ion-content>
</ion-view>

That part is where I get the id, How can I get the id of the chosen button ? and pass it on side.id ?

html site.

<ion-view view-title="Site">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="site in sites" href="#/app/conteudoDoSite/{{site.id}}">
        <span ng-bind-html="site.title"></span><span class="badge badge-assertive">{{site.post_count}}</span>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

how to pass parameter to another screen with ionic1 and angular1 ? Could anyone help me? what I am trying to do is that when the user clicks one of these buttons is passed the id.

Answer 1

You can get the information manually by calling a method by ng-click:

<button class="botao button button-positive" id="1" ng-click="getId(1)">Icon</button>

Then you can store this information in a variable:

function getId(id) {
  $scope.id = id;
  //ou, se não estiver usando $scope:
  //this.id = id;
}

And finally send it by $stateParams or $broadcast. To send by $stateParams, you need to configure the routes to consider the parameter. For example, for the view site:

$stateProvider
.state('site', {
    abstract: true,
    url: '/site',
    templateUrl: 'pages/site/site.html',
    controller: 'SiteCtrl',
    controllerAs: 'site',
    params: {
      id: null
    }
});

Then just send the parameter with $state.go('site', { id: $scope.id }) and receive with $stateParams.id at destination.

To the $broadcast the process is a little more complicated as it requires an active System in the destination (which may not occur in your case).