AngularJS - multiple $http request for a single page -

i devloping single web page angularjs. page should display contents services return values json.

i using below,

view file:

<div ng-app="phonecat">    <div ng-view></div> </div>  <div ng-app="tabletcat">   <div ng-view></div> </div> 

app js file

angular.module('phonecat', []).    config(['$routeprovider', function($routeprovider) {    $routeprovider.       when('', {templateurl: 'partials/phone-list.html',   controller: phonelistctrl}).       otherwise({redirectto: '/phones'}); }]);  angular.module('tabletcat', []).   config(['$routeprovider', function($routeprovider) {       $routeprovider.       when('', {templateurl: 'partials/tablet-list.html',   controller: tablistctrl}).       otherwise({redirectto: '/phones'});  }]); 

it displays phone list properly. not triggering tablet list.

suggest me best practice achieve this.

you can't use multiple ngapp directives in same document, mentioned the documentation :

ngapp (directive in module ng ) use directive auto-bootstrap application. 1 directive can used per html document.

you wanted rather have multiple controllers ?