Question

我的应用程序中有一个产品列表。

我的产品有 id 号码。

我想通过这些身份证号码了解我的产品详情

查看：

<div ng-init="urunGetir()" >  
  <ion-item ng-repeat="urun in urunler" class="item-thumbnail-left positive" id="anasayfa-list-item5" ng-href="/urundetay{{ urun.urun_id }}" target="_self" ng-value="urun_id=urun.urun_id" ng-click="urunDetay(urun_id)">
    <img ng-src="http://www.elli2.com/img_gorsel_/urunler/{{  data[urun.urun_id]  }}" ng-init="gorsel(urun.urun_id)">
    <h2positive>{{ urun.urun_adi }} 
      <p style="white-space:normal; font-weight: bold;">Fiyat: <span ng-show="urun.urun_ana_fiyat!=0">{{  urun.urun_ana_fiyat }} ₺</span><span ng-show="urun.urun_indirim_yuzde != 0">{{ urun.urun_fiyati }}</span></p>
      <ion-option-button class="button-positive" ></ion-option-button>
    </h2positive>
  </ion-item>
</div>

路线：

.state('urundetay',{ url:"/urundetay/:urun_id", templateUrl:'templates/urunDetay.html', controller:'urunDetayCtrl' })

控制器：

.controller('urunDetayCtrl', ['$scope','$stateParams','$http','$rootScope','$routeParams', 
function($scope,$stateParams,$http,$rootScope,$routeParams){ }])

我是离子的新人，我在等你的帮助

Answer 1

在这个场景中它会很简单：

第1步：将函数绑定到你的html

  <ion-item ng-repeat="urun in urunler" ng-click="urunDetay(urun.id)">

步骤2：现在在控制器中，当这个项目出现时，你的函数就会启动点击

$scope.urunDetay = function(urunId){
$state.go('detail',{id : urunId})
//here you gets the id , now you can pass this id to the route
(your detail template url should be 'detail/:id')
}

第3步：针对网址 detail /：id 进行模板渲染，现在就可以了
中此控制器中的 urun.id

$state.params.id

通过此ID请求API以获取项目的详细信息

Answer 2

如果您是Ionic的新手，我建议使用带有Angular 4的Ionic最新版本3.3.0。在离子版中，您不需要角度路由器来在页面之间进行路由。只需使用Ionic NavController和NavParams来导航和传递页面中的数据。您可以在Ionic文档here上阅读有关导航的更多信息。如果您是Angular 2世界的新手，请查看快速入门示例here

如何在页面之间路由，离子？

2 个答案: