0

アプリケーションで Backbone.js を使用しています。セグメントを URL に関連付けています。したがって、セグメントには多くの URL を含めることができ、特定の URL は任意のセグメントに含めることができます。URL ペインとセグメント ペインがあります。問題はハイライト部分です。そのため、セグメントをクリックすると、そこにある URL を強調表示したいと考えています。ページに表示する URL の数を 200 に制限しました。200 を超える URL がある場合は、最初の 200 をユーザーに表示し、残りはライブ検索を使用して探している URL を見つけます。 . 問題は、URL が 200 未満で、セグメントをクリックすると強調表示が機能することです。200 を超える URL があり、ユーザーがセグメントをクリックすると、強調表示が機能しません。200 を超える URL がある場合、コレクションでスライスを使用しています。最初の 200 を強調表示するだけですが、うまくいきません。これがコードスニペットです。これを修正する方法について何か良い提案はありますか?

関数の SegmentView.js でtoggleSelection:

  toggleSelection: function() {
    var max = 200;
   //get the urls
    var urls = this.App.segmentUrlCollection.urlsForSegment(this.model);
    var pixels = this.App.segmentPixelCollection.pixelsForSegment(this.model);
    if (this.selected) {
      this.deselect();
      this.selected = false;
      this.$('.summary').removeClass('selected');
      this.App.segmentCollection.each(function(segment){
       if (segment.get('name') == "Unmapped"){
          segment.view.$('.summary').addClass('unmapped');
        }
      });
      
    //If there are more than 200 urls in url Collection just highlight the first 200.
        if (this.App.urlCollection.size  > 200) {
          //problem?
            this.App.urlCollection.slice(0,199).each(function(url) {
                if (url.view.App.isUrlUnmapped(url)) {
                    url.view.$('.summary').addClass('unmapped');
                }
            });
        }
        else {
            this.App.urlCollection.each(function(url) {
                if (url.view.App.isUrlUnmapped(url)) {
                    url.view.$('.summary').addClass('unmapped');
                }
            });
        }
     //deselect the urls
       _(urls).each(function(url) {
        url.view.deselect();
      });
      _(pixels).each(function(pixel) {
        pixel.view.deselect();
      });
    } else {
      this.App.segmentCollection.each(function(segment) {
        segment.view.selected = false;
        segment.view.deselect();
      });
          this.App.segmentCollection.each(function(segment){
       if (segment.view.$('.summary').hasClass('unmapped')){
          segment.view.$('.summary').removeClass('unmapped');
        }
      });
      //If there are more than 200 urls in url Collection just highlight the first 200.
        if (this.App.urlCollection.size  > 200) {
           //problem?
            this.App.urlCollection.slice(0,199).each(function(url) {
                if (url.view.$('.summary').hasClass('unmapped')) {
                    url.view.$('.summary').removeClass('unmapped');
                }
               // url.view.deselect();
            });
        }
        else {
            this.App.urlCollection.each(function(url) {
                if (url.view.$('.summary').hasClass('unmapped')) {
                    url.view.$('.summary').removeClass('unmapped');
                }
               // url.view.deselect();
            });
        }

 //If there are more than 200 urls in url Collection just highlight the first 200.
       if (this.App.urlCollection.size  > 200) {
         //problem?
            this.App.urlCollection.slice(0,199).each(function(url) {
                 url.view.deselect();
            });
        }
        else {
            this.App.urlCollection.each(function(url) {
                 url.view.deselect();

            });
        }


      this.App.pixelCollection.each(function(pixel) {
        pixel.view.deselect();
      });

      this.select();
      this.selected = true;
      this.$('.summary').addClass('selected');
       //select the urls
      _(urls).each(function(url) {
        url.view.select();
      });
      _(pixels).each(function(pixel) {
        pixel.view.select();
      });
    }

    return false;
  }
4

1 に答える 1

2

slice配列の JavaScript メソッドであるため、コードの実行を妨げている JavaScript エラーが発生している可能性があります。バックボーン コレクションは配列ではないため、このメソッドは存在しません。

を呼び出すことで、コレクションからモデルの配列のコピーを取得できます。urlCollection.toArray()

于 2011-10-18T04:08:00.730 に答える