单击角度 2 中的上一个和下一个按钮时的下拉值更改

维文·普拉萨纳

我想在下拉菜单中将当前年份显示为默认日期,当点击 prev 按钮时,它应该将年份减一,并且它应该影响 Angular 2 下拉菜单中的选定年份值

//our root app component
import {Component, NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import { FormsModule } from '@angular/forms';

@Component({
  selector: 'my-app',
  template: `
    <h2>Select demo</h2>
    <a (click)="changeYear()">Prev</a>
    <select [(ngModel)]="selectedyear" (ngModelChange)="onChange($event)" >
      <option *ngFor="let c of year" [ngValue]="c"> {{c}} </option>
    </select>
  `
})
class App {
  year  = ['2016','2015','2014'];

  selectedyear ;

  onChange(year) {
    alert(year);
    this.selectedyear = year;
  }

  changeYear(){
    this.selectedyear = this.selectedyear -1;
    this.onChange(this.selectedyear);

  }
}


@NgModule({
  imports: [ BrowserModule, FormsModule ],
  declarations: [ App ],
  bootstrap: [ App ]
})
export class AppModule {}
萨吉塔兰

问题是当您在 2014 年之后单击上一个按钮时,它将是 2013 年,而您在数组年份中没有它。

所以每当你减少检查元素是否存在于数组内时,如果不推送到数组内。

 changeYear(){
    this.selectedyear = this.selectedyear -1;
    this.year.push(this.selectedyear); 
  }

DEMO

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用angularjs单击上一个和下一个按钮更改项目列表的活动状态

来自分类Dev

如何仅通过单击下一个和上一个按钮来更改轮播的内容?

来自分类Dev

单击时通过下一个/上一个按钮选择元素

来自分类Dev

通过单击javascript 3值中的按钮将日期更改为下一个/上一个

来自分类Dev

如何在单击按钮时从微调器中获取下一个/上一个项目?

来自分类Dev

在React应用中从模态内部单击下一个和上一个按钮时,无法使动画(淡入)在模态上工作

来自分类Dev

单击下一个和上一个按钮时如何在JQuery中访问动态生成的div元素值

来自分类Dev

使用Angular2单击添加按钮时,如何隐藏主体中的删除按钮并在下一个添加弹出窗口中显示它

来自分类Dev

下一个和上一个按钮将在OWL轮播上滑动2个项目

来自分类Dev

下一个和上一个按钮将在OWL轮播上滑动2个项目

来自分类Dev

如何确保在Flexslider动画上单击上一个下一个按钮时重新启动?

来自分类Dev

使用React Hooks单击上一个/下一个按钮时在div之间切换

来自分类Dev

当我单击“下一个/上一个”按钮时,jQuery DatePicker消失

来自分类Dev

单击下一个或上一个按钮时多次刷新页面

来自分类Dev

如何用成角度的图像替换分页的上一个和下一个按钮?

来自分类Dev

Fullcalender-单击上一个和下一个按钮时会进行多个调用

来自分类Dev

JQuery Full Calendar:“上一个”和“下一个”按钮上的某些单击将被忽略

来自分类Dev

单击上一个后,显示下一个上载按钮

来自分类Dev

单击下一个/上一个按钮时,如何将活动类更改为LI元素?

来自分类Dev

单击下一个按钮时显示下一个问题

来自分类Dev

如何在角度2中单击按钮时将数据从一个组件发送到另一个组件

来自分类Dev

如何在角度2中单击按钮时将数据从一个组件发送到另一个组件

来自分类Dev

单击Javascript中的下一个按钮后,上一个视图不消失

来自分类Dev

jQuery单击上下移动时,简单的垂直上一个和下一个按钮代码

来自分类Dev

当我在JavaScript上单击下一个和上一个时,如何设置数组的顺序?

来自分类Dev

单击具有上一个和下一个的表行

来自分类Dev

当我单击“下一个/上一个”按钮时,如何在jQuery UI日期选择器中制作月份变化的动画

来自分类Dev

获取下一个和上一个CakePHP 2的Paginator的URL

来自分类Dev

获取下一个和上一个CakePHP 2的Paginator的URL

Related 相关文章

  1. 1

    使用angularjs单击上一个和下一个按钮更改项目列表的活动状态

  2. 2

    如何仅通过单击下一个和上一个按钮来更改轮播的内容?

  3. 3

    单击时通过下一个/上一个按钮选择元素

  4. 4

    通过单击javascript 3值中的按钮将日期更改为下一个/上一个

  5. 5

    如何在单击按钮时从微调器中获取下一个/上一个项目?

  6. 6

    在React应用中从模态内部单击下一个和上一个按钮时,无法使动画(淡入)在模态上工作

  7. 7

    单击下一个和上一个按钮时如何在JQuery中访问动态生成的div元素值

  8. 8

    使用Angular2单击添加按钮时,如何隐藏主体中的删除按钮并在下一个添加弹出窗口中显示它

  9. 9

    下一个和上一个按钮将在OWL轮播上滑动2个项目

  10. 10

    下一个和上一个按钮将在OWL轮播上滑动2个项目

  11. 11

    如何确保在Flexslider动画上单击上一个下一个按钮时重新启动?

  12. 12

    使用React Hooks单击上一个/下一个按钮时在div之间切换

  13. 13

    当我单击“下一个/上一个”按钮时,jQuery DatePicker消失

  14. 14

    单击下一个或上一个按钮时多次刷新页面

  15. 15

    如何用成角度的图像替换分页的上一个和下一个按钮?

  16. 16

    Fullcalender-单击上一个和下一个按钮时会进行多个调用

  17. 17

    JQuery Full Calendar:“上一个”和“下一个”按钮上的某些单击将被忽略

  18. 18

    单击上一个后,显示下一个上载按钮

  19. 19

    单击下一个/上一个按钮时,如何将活动类更改为LI元素?

  20. 20

    单击下一个按钮时显示下一个问题

  21. 21

    如何在角度2中单击按钮时将数据从一个组件发送到另一个组件

  22. 22

    如何在角度2中单击按钮时将数据从一个组件发送到另一个组件

  23. 23

    单击Javascript中的下一个按钮后,上一个视图不消失

  24. 24

    jQuery单击上下移动时,简单的垂直上一个和下一个按钮代码

  25. 25

    当我在JavaScript上单击下一个和上一个时,如何设置数组的顺序?

  26. 26

    单击具有上一个和下一个的表行

  27. 27

    当我单击“下一个/上一个”按钮时,如何在jQuery UI日期选择器中制作月份变化的动画

  28. 28

    获取下一个和上一个CakePHP 2的Paginator的URL

  29. 29

    获取下一个和上一个CakePHP 2的Paginator的URL

热门标签

归档