1

Fala pessoal, tudo bem? Vou descrever o processo que esta me deixando com dúvida. Tenho uma lista de elementos que é preenchida com com dados que tenho. Na hora que clico em um item da lista, quero que o aplicativo abra uma página de detalhamento referente a lista que eu criei.

Ex: - Item 1: BATATA - Item 2: BANANA

Ao clicar no item 1, quero uma descrição sobre a batata. OBS: Quero utilizar apenas uma pagina de detalhes e fazer o templating dela de acordo com um id que transmito através da página de detalhes.

Vejam meu código.

RESULTADO.HTML

 <ion-view view-title="Resultados">
  <ion-content>
    <ion-list>
      <ion-item class="item item-avatar" ng-repeat="item in resultado" ng-click="openOnly(item)" href="#/app/resultado/{{item.id}}">
        <img src="{{item.imagem}}" style="top: 27.5px;">
        <h2>{{item.nome}}</h2>
        <p>{{item.endereco}}</p>
        <div class="star-avaliacao">
          <i class="ion-star"></i>
          <i class="ion-star"></i>
          <i class="ion-star"></i>
          <i class="ion-star"></i>
          <i class="ion-star"></i>
        </div>
        <i class="ion-chevron-right flechaFlutuante"></i>
        <ion-option-button class="button-positive" ng-click="edit(item)">
          Ligar
        </ion-option-button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

CONTROLLER.JS

.controller('ResultadosCtrl', function($scope) {
  $scope.resultado = [
    { nome: 'Med Imagem', endereco: 'Rua Paissandu, 1862 - Centro', imagem:'../img/medimagem.jpg', id: 1},
    { nome: 'Clinica Maia', endereco: 'Av. Francisco H. dos Santos, 1190 - JDA', imagem:'../img/user.png', id: 2}
  ];
})

.controller('DetalheCtrl', function($scope, $stateParams) {

});

Espero que consigam entendar.. Forte abraço.

2 Respostas 2

1

Vai depender de como voce esta, ou vai obter os dados, mas uma coisa que acredito que vá usar bastate são services https://docs.angularjs.org/guide/services

Service

Usando um service voce consegue guardar o objeto inteiro, e pegar ele de novo na proxima tela.

Poderia tambem guardar o resultado todo no service e tambem o id ai na proxima tela voce pega o id selecionado no service e atraves dele os detalhes do resultado, quem tambem vai estar no service.

Tem mais 2 soluções, mais ai vai depender das necessidades suas e do projeto.

Route Params

UIRouter

Minha reputação nao deixa eu postar os links :(

Os 2 são bem parecidos, basicamente voce vai poder passar o id nas na url, o que mais uso é o uirouter, que no seu caso ficaria algo bem parecido com o que você ja tem.

<ion-item class="item item-avatar" ng-repeat="item in resultado" ui-sref="resultado(id:item.id)">

Repare que tirei o ng-click, a menos que precise fazer algo antes de mandar para a proxima tela, nao ha necessidade dele.

0

Cara, passei por isso esses dias... O que eu fiz, criei um projeto padrão tabs e analisei o código gerado e adaptei para atender minha necessidade... Percebi que teria que passar o código (no seu caso é do item) pela url do projeto, assim configuraria a rota da aplicação.

Por exemplo, passa o id do item pela url e depois use o $stateParams para capturar esse valor e usar em um serviço para que seja feita a consulta.

Crie um projeto padrão de tabs, usando o comando do node: ionic start myApp tabs, depois analise o arquivos app.js, controllers.js e services.js desse projeto criado, se atente aos detalhes que você conseguirá fazer....

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .