<span>$stateProvider</span>.state(<span>'myState'</span>, { resolve:{ <span>// Example using function with simple return value.</span> <span>// Since it's not a promise, it resolves immediately.</span> simpleObj: <span><span>function</span><span>()</span></span>{ <span>return</span> {value: <span>'simple!'</span>}; }, <span>// Example using function with returned promise.</span> <span>// 这是一种典型使用方式</span> <span>// 请给函数注入任何想要的服务依赖,例如 $http</span> promiseObj: <span><span>function</span><span>(<span>$http</span>)</span></span>{ <span>// $http returns a promise for the url data</span> <span>return</span> <span>$http</span>({method: <span>'GET'</span>, url: <span>'/someUrl'</span>}); }, <span>// Another promise example. </span> <span>// 如果想对返回结果进行处理, 可以使用 .then 方法</span> <span>// 这是另一种典型使用方式</span> promiseObj2: <span><span>function</span><span>(<span>$http</span>)</span></span>{ <span>return</span> <span>$http</span>({method: <span>'GET'</span>, url: <span>'/someUrl'</span>}) .then (<span><span>function</span> <span>(data)</span> </span>{ <span>return</span> doSomeStuffFirst(data); }); }, <span>// 使用服务名的例子,这将在模块中查找名称为 'translations' 的服务,并返回该服务 </span> <span>// Note: The service could return a promise and</span> <span>// it would work just like the example above</span> translations: <span>"translations"</span>, <span>// 将服务模块作为解决函数的依赖项,通过参数传入</span> <span>// 提示:依赖项 $stateParams 代表 url 中的参数</span> translations2: <span><span>function</span><span>(translations, <span>$stateParams</span>)</span></span>{ <span>// Assume that getLang is a service method</span> <span>// that uses $http to fetch some translations.</span> <span>// Also assume our url was "/:lang/home".</span> translations.getLang(<span>$stateParams</span>.lang); }, <span>// Example showing returning of custom made promise</span> greeting: <span><span>function</span><span>(<span>$q</span>, <span>$timeout</span>)</span></span>{ <span>var</span> deferred = <span>$q</span>.defer(); <span>$timeout</span>(<span><span>function</span><span>()</span> </span>{ deferred.resolve(<span>'Hello!'</span>); }, <span>1000</span>); <span>return</span> deferred.promise; } }, <span>// 控制器将等待上面的解决项都被解决后才被实例化</span> controller: <span><span>function</span><span>(<span>$scope</span>, simpleObj, promiseObj, promiseObj2, translations, translations2, greeting)</span></span>{ <span>$scope</span>.simple = simpleObj.value; <span>// 这里可以放心使用 promiseObj 中的对象</span> <span>$scope</span>.items = promiseObj.items; <span>$scope</span>.items = promiseObj2.items; <span>$scope</span>.title = translations.getLang(<span>"english"</span>).title; <span>$scope</span>.title = translations2.title; <span>$scope</span>.greeting = greeting; } })
为 $state 对象提供自定义数据
可以给 $state 对象提供自定义数据(建议使用data属性,以免冲突)
<span>// 基于对象和基于字符串定义 state 的例子</span> <span>var</span> contacts = { name: <span>'contacts'</span>, templateUrl: <span>'contacts.html'</span>, data: { customData1: <span>5</span>, customData2: <span>"blue"</span> } } $stateProvider .state(contacts) .state(<span>'contacts.list'</span>, { templateUrl: <span>'contacts.list.html'</span>, data: { customData1: <span>44</span>, customData2: <span>"red"</span> } })
可以通过下面的方式来访问上面定义的数据: