智能表 - preSELECT特定的行 [英] Smart-Table - Preselect a specific row

问题描述

我使用智能表，我需要preSELECT特定行。

I'm using smart-table and I need to preselect a specific row.

所以，我加载列表之后，我进入循环，并设置了 isSelected 属性，当我到达项目我想选择：

So after loading my list, I loop into it and set the isSelected attribute when I reach the item I want to select:

// Preselect a row
for (var i = 0, len = scope.displayCollection.length; i < len; i += 1) {
    var person = scope.displayCollection[i];
    if (person.firstName === 'Blandine') {
        person.isSelected = true;
        scope.selected = person;
        break;
    }
}

它的工作很好，但是当我要选择另一条线，则preselected行不未被选择！我必须点击它来手动取消选中它，然后才能正确地选择另一条线路。

It's working fine, but when I want to select another line, the preselected line is not unselected! I have to click on it to manually unselect it and then be able to select another line correctly.

下面是一个解释的jsfiddle问题： http://jsfiddle.net/6pykn5hu/3/

Here is a JSFiddle explaining the issue: http://jsfiddle.net/6pykn5hu/3/

我想什么建议有<一个href=\"http://stackoverflow.com/questions/29193530/smart-table-select-first-row-displayed-angularjs\">Smart-Table - 选择显示第一行（angularjs），但没能有成才的工作

I tried what's proposed there Smart-Table - Select first row displayed (angularjs) but did not manage to have someting working.

感谢

推荐答案

所以我通过他们的指令，你可以看到它在父指令调用函数 stTable 。在行绑定到一个单击处理程序......从<$ C调用 ctrl.select（）功能$ C> stTable 这个功能又保存最后选择的行。这是你的问题，因为这个事件不会触发它不落的最后一行点击，因此从未看起来删除其类。我改写指令给你，这样它会为你工作要实现的目标是什么，但它可能pretty容易改善。

So I looked through their directive as you can see it calls a function in a parent directive stTable. The row is bound to a click handler...Which calls the ctrl.select() function from stTable this function in turn stores the last selected row. This is your problem because this event does not fire it never sets the last clicked row and thus never looks to remove its class. I rewrote the directive for you so that it would work for what you are trying to achieve but it could pretty easily be improved.

app.directive('prSystem', function () {
  return {
    restrict: 'A',
      require: '^stTable',
      scope: {
        row: '=prSystem'
      },
      link: function (scope, element, attr, ctrl) {
          var mode = attr.stSelectMode || 'single';
          if(scope.row.isSelected) {
              scope.row.isSelected = undefined;
              ctrl.select(scope.row, mode);
          }

        element.bind('click', function () {
          scope.$apply(function () {
            ctrl.select(scope.row, mode);
          });
        });

        scope.$watch('row.isSelected', function (newValue) {
          if (newValue === true) {
            element.addClass('st-selected');
          } else {
            element.removeClass('st-selected');
          }
        });
      }
  }
})

这篇关于智能表 - preSELECT特定的行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！