如果点击列表,打开新页面

时间:2017-07-01 12:40:53

标签: angularjs ionic-framework

我在html中有这段代码

<ion-list>
<div class="card" ng-repeat="sign in signs.List">
<ion-item>
<div class="video-container">
<img class="animated" ng-src="{{sign.animated_src}}" width="200" 
height="150"/>
<img class="simple" ng-src="{{sign.simple_src}}" width="200" height="150"/>
</div>

 <div class="item item-icon-left assertive">
 <i class="icon ion-document"></i>
  {{sign.text}}
  </div>
  </ion-item>
  </div>
  </ion-list>

我正在努力实现以下目标

  • 我需要知道用户选择哪个文本在其他页面中进行重定向。
  • 每个文字都有相应的页面。

1 个答案:

答案 0 :(得分:0)

您只需要在项目列表中添加ng-click功能,您就可以传递txt prams并重定向它。

<ion-list>
<div class="card" ng-repeat="sign in signs.List">
<ion-item ng-click="onSelect(sign.text)">
<div class="video-container">
<img class="animated" ng-src="{{sign.animated_src}}" width="200" 
height="150"/>
<img class="simple" ng-src="{{sign.simple_src}}" width="200" height="150"/>
</div>
 <div class="item item-icon-left assertive">
 <i class="icon ion-document"></i>
  {{sign.text}}
  </div>
  </ion-item>
  </div>
  </ion-list>

在Controller代码中,您只需要创建函数

$scope.onSelect = function (text){
      //if you using ui-state
   $state.go('stateName', {txt: text})
}

如果您使用angularjs路由,那么

$location.path('/stateName/').search({txt: text});

网址将显示为/stateName/?txt=value