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和上面一样。

  • 相关阅读:
    爬去搜狐新闻体育类
    python中创建迭代器
    python中smtp协议的运用
    人如何修炼才能增强精神力
    修炼精神力量
    Java进阶图谱
    提高做一件事的成功概率
    详细说servlet
    深圳买车上牌流程
    excel 散点图预测
  • 原文地址:https://www.cnblogs.com/wskxy/p/9689628.html
Copyright © 2011-2022 走看看