在AngularJS中展开Kendo PanelBar面板

Expand Kendo PanelBar panel in AngularJS

本文关键字：Kendo PanelBar 面板 AngularJS      更新时间：2024-06-06

当Kendo UI PanelBar网格的第一个面板最初基于数据库中的参数加载页面时，我正试图展开它们。因此，与其在li标记上使用class="k-state-active"，不如从我的AngularJS控制器以编程方式扩展面板栏中的面板。

这是我的面板html:

  <ul kendo-panel-bar k-options="panelBarOptions" ng-controller="CreateItemCtrl" id="commentsPanelBar">
    <li style="margin-top:0;margin-bottom:0;">
      COMMENTS
      <ul>
        <li style="height:140px;" id="pbComments">
           <input type='text' id='tbComments'></input>
        </li>
      </ul>
    </li>
  </ul>

以下是我在控制器代码中尝试的内容：

$scope.commentsPanelBar = {};
$scope.commentsPanelBar = $('#commentsPanelBar');
$scope.commentsPanelBar.data('kendoPanelBar').expand($('#pbComments'));

运行完这段代码后，我得到了一个错误，即"expand"不是一个函数。我知道这个页面引用了剑道脚本，因为PanelBar会展开和折叠。

我看到您正试图通过"commentsPanelBar"名称引用组件。我认为这是不正确的——据我所知，你应该定义你想在范围内使用的名称：

<ul kendo-panel-bar="kendoBar" ...>

您可以通过名称引用变量：

$scope.kendoBar.expand()

您可以在这里阅读关于在Angular中定义小部件引用的可能方法：http://docs.telerik.com/kendo-ui/AngularJS/introduction#widget-引用

相关文章：