如何通过kendo和angular初始化视图?

时间:2015-02-26 12:44:24

标签: angularjs kendo-ui

是否有任何选项可以使用angular来为kendo ui初始化视图,如下代码所示:

<div data-role="view" id="foo"><a data-role="button">Foo</a></div>

<div data-role="view" id="bar"><a data-role="button">Bar</a></div>

<script>
new kendo.mobile.Application($(document.body), { initial: "#foo" });
</script>

1 个答案:

答案 0 :(得分:0)

是的,这可以通过kendo-mobile-application指令实现:

<body kendo-mobile-application="mobileApp" ng-app="foo">
  <kendo-mobile-view ng-controller="mine" k-title="'My Title'" k-layout="'default'">
    <kendo-mobile-header>
        <kendo-mobile-nav-bar>
            <kendo-view-title></kendo-view-title>
        </kendo-mobile-nav-bar>
    </kendo-mobile-header>
  </kendo-mobile-view>

  <script>
    angular.module("foo", [ "kendo.directives" ])
        .controller("main", ["$rootScope", "$scope", function($rootScope, $scope) {
            $scope.hello = "Hello World!";

            // show the application loader animation
            $rootScope.mobileApp.showLoading();
        });
  </script>
</body>

documentation中提供了更多信息。