小编Wit*_*zyk的帖子

angular:如何循环数字?

我有一个项目集合,其中每个项目都有一个rank属性,这是一个数字.我想循环这个数字,这是我尝试过的:

<div class="col-md-3 col-sm-4 item-container" *ngFor="let item of items">
    <div class="item">
        <p class="rank">
            <img src="" class="img-responsive" *ngFor="let rank of item.rank"/>
        </p>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

打字稿:

export class MonthpicksComponent{

    items: Item[] = [];
    //...
}

export class Item{
  id: number;
  name: string;
  img: string;
  desc: string;
  rank: number;
  voters: number;
}
Run Code Online (Sandbox Code Playgroud)

但不幸的是,第一个循环只显示一个结果而第二个循环没有显示任何结果.

ngfor angular

13
推荐指数
5
解决办法
2万
查看次数

隐藏前的模态事件

我有个问题.我需要显示toastr通知当有人想隐藏模态时不会保存更改.我需要在模态隐藏之前触发toastr,当用户再次尝试关闭模态时允许这样做.我试过这样的事情:

declare let jQuery: any;
declare let $: any;
declare let toastr: any;

@Component({
  selector: 'app-trigger',
  templateUrl: './trigger.component.html',
  styleUrls: ['./trigger.component.scss']
})
export class TriggerComponent implements OnInit {

  name: string

  private canHideModal = true;

  constructor() {
  }


ngOnInit(){
      const self = this;
      $('#triggerModal').on('hide.bs.modal', () => {
        if (self.canHideModal) {
          //hide modal here  <---------
        } else {
          toastr['warning']('You have unsaved changes');

          self.canHideModal = true;
           return false
        }
       });
    }

 fireModal(changes : {action:string, name:string}){
   changes.action  = 'show';
   changes.name = 'test';
   this.name = changes.name …
Run Code Online (Sandbox Code Playgroud)

javascript jquery twitter-bootstrap bootstrap-modal angular

6
推荐指数
1
解决办法
625
查看次数

Bootstrap响应断点的大小属性

我正在我的页面上进行优化,这一切都很顺利,因为我想出了一个实现srcsetsizes属性的想法<img>.我使用新的缩放图像(额外的1200w,大型992w,中型786w,小型576w,extra_small-320w)创建php构造img对象和填充srcset属性的函数和通用(尽可能多的可用)sizes属性(下面的示例) .当开始使用杂发生启动问题引导网格系统对于不同的vw(视图宽度),例如col-lg-4 col-md-6.我尝试了很多不同的版本,sizes但它似乎没有工作,除了一个:

sizes="(min-width: 36em) calc(.333 * (100vw - 12em)), 100vw"

这是有效的,但对于一个网格 - 在这个例子.333中是col-4.(12em是sidenav宽度).

但是对于多个网格,我尝试了这个:

sizes="(max-width: 575.98px) 100vw,
        ((min-width: 576px) and (max-width: 767.98px)) 100vw,
        ((min-width: 768px) and (max-width: 991.98px)) calc(.5 * 100vw),
        ((min-width: 992px) and (max-width: 1199.98px)) calc(.333 * 100vw),
        ((min-width: 1200px) and (max-width: 1440.98px)) calc(.333 * 100vw),
        (min-width: 1441px) calc(.333 * …
Run Code Online (Sandbox Code Playgroud)

html media-queries twitter-bootstrap srcset bootstrap-4

5
推荐指数
1
解决办法
1675
查看次数