angular.js - angular路由的控制器
問(wèn)題描述
路由時(shí)兩個(gè)頁(yè)面能公用一個(gè)控制器嗎,比如
javascript .state(’a’, {...controller : ’aaaController’ }) .state(’b’, {...controller : ’aaaController’ })
如果行的話,控制器是獨(dú)立的作用域還是公用的,比如說(shuō)我在控制器里聲明了個(gè)變量i,在a頁(yè)面中改變了i的值,當(dāng)我路由到b頁(yè)面時(shí),i的值會(huì)跟著變嗎
問(wèn)題解答
回答1:最近也在學(xué)習(xí)angularjs,就樓主所說(shuō)的問(wèn)題,可以做一個(gè)簡(jiǎn)單的演示:
有如下的html結(jié)構(gòu),不同的view,相同的conroller
<p ng-controller='MyCtrl'> <button ng-click='change()'>change to 3</button></p><p ng-controller='MyCtrl'> <button ng-click='show()'>show</button></p>
部分controller代碼:
.controller(’MyCtrl’, function ($scope, $log) {$scope.num = 2;$scope.change = function () { $scope.num = 3;};$scope.show = function () { $log.info($scope.num);}; });
首先點(diǎn)擊show按鈕,輸出結(jié)果如下:
然后點(diǎn)擊change to 3按鈕,再次點(diǎn)擊show按鈕,結(jié)果如下:
從這個(gè)實(shí)驗(yàn)可以看出,雖然是同一個(gè)controller,實(shí)際上scope是兩個(gè)完全不相干的scope。scope的結(jié)構(gòu)也是樹(shù)形的,同dom結(jié)構(gòu)對(duì)應(yīng),如上的html結(jié)構(gòu)就會(huì)有兩個(gè)scope。再看一個(gè)明顯的例子:
.controller(’MyCtrl’, function ($scope, $log) {$log.info(’init scope...’); });
看控制臺(tái)
結(jié)果打印了兩遍,說(shuō)明方法執(zhí)行了兩次。如果共享scope就不會(huì)執(zhí)行兩次了。
綜上:你在控制器里聲明了個(gè)變量i,在a頁(yè)面中改變了i的值,當(dāng)你路由到b頁(yè)面時(shí),i的值不會(huì)改變
hope help you!
回答2:這樣子使用比較奇怪,不太確定這樣使用是否可行
個(gè)人覺(jué)得正常的用法是:一個(gè)頁(yè)面,一個(gè)控制器如果是需要控制器之間共用變量和方法,可以通過(guò)在angular里建一個(gè)service存放變量和方法,在不同的controller里面,注入我們寫的service就可以了
官方文檔里也有明確說(shuō)明service是用來(lái)share code的:ServicesAngular services are substitutable objects that are wired together using dependency injection (DI). You can use services to organize and share code across your app.
https://docs.angularjs.org/guide/services
回答3:切換路由后控制器的生命周期就結(jié)束了,當(dāng)前的$scope及子作用域就都死了。如果需要在多個(gè)控制器之間共享數(shù)據(jù),可以使用服務(wù)。
相關(guān)文章:
1. golang - 用IDE看docker源碼時(shí)的小問(wèn)題2. html - css氣泡,實(shí)現(xiàn)“倒三角(不知道算不算三角了)”可透明的。3. phpstudy8.1沒(méi)集成mysql-front4. java - 如何點(diǎn)擊按鈕,重新運(yùn)行(我是初學(xué)者)?5. 運(yùn)行python程序時(shí)出現(xiàn)“應(yīng)用程序發(fā)生異?!钡膬?nèi)存錯(cuò)誤?6. 我何時(shí)應(yīng)該在Java中使用JFrame.add(component)和JFrame.getContentPane()。add(component)7. 利用IPMI遠(yuǎn)程安裝centos報(bào)錯(cuò)!8. 前端 - @media query 使用出現(xiàn)的問(wèn)題?9. html5和Flash對(duì)抗是什么情況?10. javascript - 請(qǐng)指條明路,angular的$event,在select中卻是undefined?

網(wǎng)公網(wǎng)安備