Set Initial View Prior to Initialization
The example below demonstrates how to set the initial view at runtime prior to the initialization of the application in AngularJS when working with the Hybrid UI components of Kendo UI.
<style>
html, body {
height: 100%;
}
</style>
<body kendo-mobile-application id="kma" ng-app="kendoDemo" ng-controller="appController" k-initial="initialView">
<kendo-mobile-view id="view1" ng-controller="main1">
view1
</kendo-mobile-view>
<kendo-mobile-view id="view2" ng-controller="main2">
view2
</kendo-mobile-view>
<script>
angular.module("kendoDemo", [ "kendo.directives" ])
.run(["$rootScope", function($rootScope) {
$rootScope.initialView = "view2"
}])
.controller("appController", function($scope) {
})
.controller("main1", function($scope) {
})
.controller("main2", function($scope) {
});
</script>
</body>
See Also
Articles and other how-to examples on the Kendo UI hybrid components:
- Overview of the Hybrid UI Components in Kendo UI
- How to Create Fixed Content Areas with Scroller
- How to Create Relative Content Size Using Flexboxes
- How to Select Value from Another View
For more runnable examples on the Kendo UI hybrid controls, browse the How To documentation folder.