小编Mce*_*one的帖子

我使用jquery ui创建了一个日期范围选择器,您可以使用相同的内联日历来选择日期.

看看我的小提琴:http://jsfiddle.net/kVsbq/4/

JS

$(".datepicker").datepicker({
    minDate: 0,
    numberOfMonths: [12, 1],
    beforeShowDay: function (date) {
        var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val());
        var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val());
        return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""];
    },
    onSelect: function (dateText, inst) {
        var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val());
        var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val());
        if (!date1 || date2) {
            $("#input1").val(dateText);
            $("#input2").val("");
            $(this).datepicker();
        } else {
            $("#input2").val(dateText);
            $(this).datepicker();
        }
    }
}); …

我发现这个问题让我几乎到了我需要的地方. 为什么ng-click不能在我的指令中工作？如何添加切换类？

这使得我的指令模板中的ng-click触发了我的控制器中的一个功能. http://plnkr.co/edit/GorcZZppa8qcIKbQAg2v?p=preview

问题是返回到我的控制器(项目)的参数是未定义的.我需要这个实际传递来自我的指令中的变量的数据,以便在我将在控制器中运行的函数中使用.

指令模板文件

<div class="tsProductAttribute" 
        ng-class="{'tsProductAttribute--selected': selected}" 
        ng-click="toggleState(item)">

    <span class="tsProductAttribute-image">
        <img ng-src="{{variantImage}}">
    </span>
    <span class="tsProductAttribute-desc">{{item.productName}}</span>
    <select ng-model="variantImage">
        <option  ng-repeat="variant in item.variants" value="{{variant.image}}">{{variant.name}} - {{variant.listprice.amount}}</option>
    </select>
    <span class="tsProductAttribute-price">{{item.variants[0].listprice.amount}} {{item.variants[0].listprice.entity}}</span>
</div>

指示

angular.module('msfApp')
.directive('listitem', function () {
    return {
        templateUrl: 'assets/templates/directives/listitem.html',
        restrict: 'E',
        scope: {
            'item': '=',
            'itemClick': '&'
        },
        link: function(scope, iElement, iAttrs) {
          scope.selected = false;
          scope.toggleState = function(item) {
            scope.selected = !scope.selected;
            scope.itemClick(item);
          }
        }
    }
});

指令实施

<listitem item="item" item-click="toggleInBasket(item)"></listitem>

控制器中的功能

$scope.toggleInBasket = …

见小提琴

我得到了一系列“跨度”，需要在 HTML 中的这些索引处添加 div 以“突出显示”该范围的文本。目前，我在要突出显示的文本周围添加 spanStarting spanEnding。后来，我用 .spanStarting/spanEnding 替换了 spanStarting/spanEnding。

跨度如下所示：

{
"begin": 145,
"end": 155
}

只要跨度从不重叠，我就可以工作，现在我需要处理重叠的跨度。例如，重叠跨度如下所示：

{
"begin": 4,
"end": 18
},{
"begin": 4,
"end": 41
}

当跨度重叠时添加 spanStarting/spanEnding 会扭曲索引并导致无法找到要突出显示的正确文本。 你可以在这个fiddle 中看到我到目前为止所拥有的。由于存在重叠跨度，我的代码无法找到正确的索引来放置代码。

我的代码：

String.prototype.replaceBetween = function(start, end, what) {
  start = this.substring(0, start);
  end = this.substring(end, this.length);
  return start + what + end;
};

function createHighlights(subElements, snippet, raw) {
  var currentHighlight = subElements;
  currentHighlight.spanStart = currentHighlight.begin;
  currentHighlight.spanStop = currentHighlight.end;
  var currentWord = raw.substring(currentHighlight.spanStart, currentHighlight.spanStop); …