1、html引入:

<p-dropdown float-right [options]="sortOption"  [(ngModel)]="sortNow" optionLabel="name" (onChange)="changeType()"></p-dropdown>

2、在当前总模块或页面模块里引入模块:

import {DropdownModule} from 'primeng/dropdown';

3、在ts页面中初始化组件的值,并获取选中的值,并提交个后台:

export class DerailParticulars {
// 初始化下拉选项的值
sortOption:Array<object> = [];
// 初始化默认选中的下拉框的值(必须和this.sortOption内元素的数据类型一致)
sortNow:any = {name:'最新作品',type:'newest'};
ionViewDidLoad() {
this.sortOption = [
{name: '最新作品', type: 'newest'},
{name: '热门作品', type: 'hot'}
];
}
changeType(){
let type = this.sortNow.type;
// 获取当前选中的下拉框的值对应的产品列表
this.getProductList(type)
}
getProduceList(){
// 获取产品列表请求
}
}

解释:1、this.sortNow 为当前选中的下拉框的值对应的this.sortOption中的某个对象,this.sortNow.type即为提交给后台的类型值。

     2、html里的optionLabel属性值应和初始化下拉框值列表的要显示的类型的属性名对应。如示例中的name属性。

4、完结。

最新文章

  1. ARM各种处理器参数
  2. go语言和资料
  3. words in view Moqui resource code
  4. Chrome开发者工具学习
  5. Helpers\FastCache
  6. php 图片压缩
  7. 闲话shuffle(洗牌)算法
  8. Gradle[1]gradle distZip时,增加目录信息到zip中
  9. ant基础[转]
  10. Xampp apache与mySQL开不了 解决办法
  11. 【非官方】Surging 微服务框架使用入门
  12. WordPress安装官方文档教程
  13. Cartfile学习参考博客
  14. Git基础使用教程
  15. python之路--初识html前端
  16. Stream、FileStream、MemoryStream的区别
  17. JavaScript实现字符串逆置的几种方法
  18. plsql developer无法识别32位oracle问题如何解决?
  19. DIY自己的AllocateHWnd函数
  20. WordPress基础:极简手动安装教程

热门文章

  1. 七、WebApi跨域操作
  2. Sass Maps的函数-map-keys($map)
  3. shell 单行多行注释
  4. ssm科普篇
  5. commons-fileupload-1.2.1.jar 插件上传与下载
  6. kNN(从文本文件中解析数据)
  7. http_load(基于linux平台的一种性能测试工具)
  8. 集训队8月9日(组合计数+容斥原理+Mobius函数)
  9. 【系统架构理论】一篇文章精通:Spring Cloud Netflix Eureka
  10. linux设备驱动第三篇:写一个简单的字符设备驱动