Question

我在我的项目中使用了handontable angular指令。通常我们将handsontable定义为

<ui-handsontable minSpareRows="2" stretchH="'hybrid'" datarows="item in items">

我希望像范围中的minSpareRows这样的属性值像

一样

我试过了

minSpareRows = {{minrows}}
NG-ATTR-minSpareRows = “{{minrows}}”

请指导。

Answer 1

你想要这些属性到底在哪里？你可以这样做：

angular.module('yourApp')
 .directive('uiHandsontable', function () {
    return {
        restrict: 'E',
        link: function postLink(scope, element, attrs) {
          scope.minSpareRows = attrs.minSpareRows
        }
    };
});

这将把它附加到你的指令的范围，所以在你可以调用{{minSpareRows}}的指令的html模板中

Answer 2

我遇到了这个post。其中一个人说：

魔术主要在范围内：声明中的声明定义。有任何范围：{}在那里将“隔离”范围来自父母，意味着它获得了它自己的范围......没有它，它会使用父母的范围。魔法的其余部分在范围内属性：范围：{'internalScopeProperty'： '= externalAttributeName'} ...其中=表示双向绑定场景。如果你将那个=更改为@，你会看到它只允许你将字符串作为属性传递给指令。＆amp;是为了执行函数来自父作用域的上下文。

所以我去了handontable角度指令“angular-ui-handsontable.full.js”的代码并更改了行

var htOptions = ['data', 'width', 'height', 'rowHeaders', 'colHeaders', 'colWidths', 'columns', 'cells', 'dataSchema', 'contextMenu', 'onSelection', 'onSelectionByProp', 'onBeforeChange', 'onChange', 'onCopyLimit', 'startRows', 'startCols', 'minRows', 'minCols', 'maxRows', 'maxCols', 'minSpareRows', 'minSpareCols', 'multiSelect', 'fillHandle', 'undo', 'outsideClickDeselects', 'enterBeginsEditing', 'enterMoves', 'tabMoves', 'autoWrapRow', 'autoWrapCol', 'copyRowsLimit', 'copyColsLimit', 'currentRowClassName', 'currentColClassName', 'asyncRendering', 'stretchH', 'columnSorting', 'manualColumnMove', 'manualColumnResize', 'fragmentSelection', 'scrollbarModelV', 'scrollbarModelH'];

var scopeDef = {
  selectedIndex: '=selectedindex'
};
for (var i = 0, ilen = htOptions.length; i < ilen; i++) {
  scopeDef[htOptions[i]] = '=' + htOptions[i].toLowerCase();
}

与

var htOptions = ['data', 'width', 'height', 'rowHeaders', 'colHeaders', 'colWidths', 'columns', 'cells', 'dataSchema', 'contextMenu', 'onSelection', 'onSelectionByProp', 'onBeforeChange', 'onChange', 'onCopyLimit', 'startRows', 'startCols', 'minRows', 'minCols', 'maxRows', 'maxCols', 'minSpareRows', 'minSpareCols', 'multiSelect', 'fillHandle', 'undo', 'outsideClickDeselects', 'enterBeginsEditing', 'enterMoves', 'tabMoves', 'autoWrapRow', 'autoWrapCol', 'copyRowsLimit', 'copyColsLimit', 'currentRowClassName', 'currentColClassName', 'asyncRendering', 'stretchH', 'columnSorting', 'manualColumnMove', 'manualColumnResize', 'fragmentSelection', 'scrollbarModelV', 'scrollbarModelH'];
var scopeDef = {
  selectedIndex: '=selectedindex'
};
for (var i = 0, ilen = htOptions.length; i < ilen; i++) {
  scopeDef[htOptions[i]] = '@' + htOptions[i].toLowerCase();
}

然后当我使用

<ui-handsontable minSpareRows="{{cx}}" stretchH="'hybrid'" datarows="item in items">

它奏效了。我正在把它放在handontable github的请求上。

从范围变量</ui-handsontable>传递HandsonTable Angular Directive＆lt; <ui-handsontable>中的属性

2 个答案: