zoukankan      html  css  js  c++  java
  • 新闻列表、新闻详情

    1.函数跳转

      News跳转函数

    import { NewsinfoPage } from '../newsinfo/newsinfo';
    import { NavController } from 'ionic-angular';
      list = [];
      constructor(public navCtrl: NavController) {
        for (let i = 0; i < 10; i++) {
          this.list.push(`第${i}条数据`)
        }
      }
    
      goInfo(index) {
        this.navCtrl.push(NewsinfoPage,{
          key:index,
          value:"kxy"
        });
      }

      html

      <ion-list >
        <ion-item *ngFor="let item of list;let key=index" (click)="goInfo(key)">
          {{item}}
        </ion-item>
      </ion-list>

      Newsinfo接收函数

    import {  NavParams } from 'ionic-angular';
    public key;
      public value;
      constructor(public navCtrl: NavController, public navParams: NavParams) {
        this.key=navParams.get('key');
        this.value=navParams.get('value')
      }

     2.属性跳转

      News跳转函数

      不需要引入NavController、NavParams

    import { NewsinfoPage } from '../newsinfo/newsinfo';
      public NewsinfoPage=NewsinfoPage;//一定要写,吧NewsinfoPage赋值给一个属性,前端只能调用属性
      public list = [];
      public params;
      constructor() {
        for (let i = 0; i < 10; i++) {
          this.list.push(`第${i}条数据`)
        }
        this.params={
          key:123,
          value:"kxy"
        }
      }

      html

      <ion-list >
        <ion-item *ngFor="let item of list;let key=index" [navPush]="NewsinfoPage" [navParams]="params">
          {{item}}
        </ion-item>
      </ion-list>

      NewsInfo和上面一样。

  • 相关阅读:
    Lua 语言学习
    Unity EasyTouch官方案例学习
    Unity Dotween官方案例学习
    斗地主出牌规则
    C# XML文件读取
    斗地主项目总结
    C# 委托和事件
    C# 观察者模式
    消防法及相关法律法规(二)
    消防法及相关法律法规(一)
  • 原文地址:https://www.cnblogs.com/wskxy/p/9689628.html
Copyright © 2011-2022 走看看