共享範圍之間的視圖/控制器

讓我們解釋什麼，我想：

我有，我可以爲了元素的樹視圖。當我雙擊其中一個元素時，我希望頁面可以切換到一個表單，填充單擊元素的信息。當我保存表格時，它會返回到樹視圖，修改元素。

我是如何試圖做到這一點的？

我有我的主視圖treeView，其控制器treeViewController。我有一個加載元素的工廠。

//treeViewController 
$scope = factory.getelement() 
//whatever else I need

我已經試過有另一種觀點認爲「fullEdit」我希望它共享的範圍，完全（也可以分享它不會母校實際上是相同的控制器）。這意味着當我修改其在樹中修改的「fullEdit」中的$ scope.element時。

問題是，隨着控制器加載示波器，每當我切換視圖時，我重新加載了範圍。

我試過用嵌套狀態的ui路由器（我不認爲這是解決方案）。許多人建議多視圖來獲得我想要的，但是我已經嘗試過了，我得到的所有視圖都在同一頁面上顯示，這不是我想要的。此外，這兩種觀點似乎仍然是獨立的。

此外，使用全局範圍似乎不是一個好的解決方案。

編輯/其實我的問題是，當我改變視圖控制器被執行，因此範圍從後端重新加載。我不希望這樣，我想分享$ scope，但不會每次更改視圖時重新加載它！

來源

2014-10-09 Eagle1

angular.module('myApp', []) 
 
    .controller('myCtrlOne', function myCtrlOne($scope, reusableData) { 
 
    $scope.service = reusableData 
 
    }) 
 
    .controller('myCtrlTwo', function myCtrlOne($scope, reusableData) { 
 
    $scope.service = reusableData 
 
    }) 
 
    .service('reusableData', function() { 
 
    return { 
 
     message: 'initial msg' 
 
    } 
 
    })

<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 

 
<head> 
 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <div ng-controller="myCtrlOne"> 
 
    <input type="text" ng-model="service.message"> 
 
    </div> 
 
    <hr> 
 
    <div ng-controller="myCtrlTwo"> 
 
    <input type="text" ng-model="service.message"> 
 
    </div> 
 
</body> 
 

 
</html>

如果你運行這段代碼（上帝，我lvoe此功能），你會看到兩個輸入每個不同的控制器內，他們通過服務共享數據，只要網頁不刷新該服務（這是簡單的 - 每次運行一個實例）將保持您的更改

來源

2014-10-09 08:36:24 maurycy

這似乎是一個好方法。我只需要隱藏/取消隱藏其中一個div。這是我原本打算使用Jquery完成的，但它更好地分享範圍。謝謝，我今晚會嘗試。 – Eagle1 2014-10-09 08:58:04

該服務將跨視圖共享數據，您可以使用單獨的控制器，然後注入服務，這就是它 – maurycy 2014-10-09 08:58:43

服務，而不是工廠？ – Eagle1 2014-10-09 09:33:02

共享範圍之間的視圖/控制器

回答

相關問題