angular ui router - Why angularjs throws me up an error if I try to use "resolve" inside "views"? -

as wrote, maybe can't use "resolve" inside "views" "view"

i'm trying figure out how avoid multiple ajax call same api/url, because if use getchildren is, , use inside n subview@views, angular makes n ajax call.

routes.js:

.state("multi",{             url: "/multi",             views: {                  "viewb@multi": {                     templateurl: "app/templates/login.htm",                     controller: ["$scope", "httppost", "getchildrennumber", function($scope, httppost, getchildrennumber){                         this.children = getchildrennumber.data.errormessage + " miao";                      }],                     controlleras: "ctrl"                 },                 "viewc@multi": {                     templateurl: "app/templates/viewc.htm",                     controller: ["$scope", "getlogin", function($scope, getlogin){                         this.seconderrormsg = getlogin.data.errormessage;                     }],                     controlleras: "ctrl"                 },                 resolve: {                     getlogin: function(httppost){                         return httppost.get("http://domain.com/user/login/api-login", { username:"ciaociao6@ciao.com", password:"ciaocia0" } );                      }                 }             },             resolve: {                 getchildrennumber: function(httppost){                     return httppost.get("http://domain.com/user/login/api-login", { username:"ciaociao6@ciao.com", password:"ciaocia0" } );                  }             }         }); 

like said yourself, cannot use:

views: {   someview: {},   someotherview: {},   resolve: {} } 

you can go this;

state: {   resolve: {     getchildren: function () {}, // 1 time.     getlogin:    function () {} // 1 time.   },   views: {     /**       * inject resolved values       * view controllers.       */     viewa: {       controller: function (getchildren, getlogin) {}     },     viewb: {       controller: function (getlogin) {}     },     viewc: {       controller: function (getlogin) {}     }   } } 

and resolve functions run once, it's shared across views.

jsfiddle