在AngularJS中展开Kendo PanelBar面板

时间:2016-04-13 19:57:41

标签: javascript angularjs kendo-ui expand

我试图让我的Kendo UI PanelBar网格的第一个面板在他们最初根据数据库中的参数加载页面时进行扩展。所以不要使用class =" k-state-active"在li标签上,以编程方式从我的AngularJS控制器中展开面板栏中的面板。

这是我的Panel 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'));

运行此代码后,我收到错误消息&#34; expand&#34;不是一个功能。我知道此页面中引用了kendo脚本,因为PanelBar会扩展和折叠。

1 个答案:

答案 0 :(得分:0)

我看到你试图通过“commentsPanelBar”名称引用该组件。我认为这是不正确的 - 据我所知,你应该在范围内定义你想要的名称:

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

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

$scope.kendoBar.expand()

您可以在此处阅读有关在Angular中定义窗口小部件引用的可能方法: http://docs.telerik.com/kendo-ui/AngularJS/introduction#widget-references