AngularJS - 如何修改$ rootScope中的變量？

我有一個可能真正愚蠢的問題，但是如何在Angular的$ rootScope中修改變量？我有一個幻燈片邊欄，我想在有人點擊縮略圖時更改內容，並且我想出了處理邊欄中的數據來源/邊欄可見性要麼是全局值的最簡單方法或$ rootScope中。我試圖儘可能保持簡單，但我不知道如何處理修改的全局變量。周邊

我的角碼是這樣的：

app.run(function($rootScope) { 
    $rootScope.currentUrl = { value: 'visual/design/1/' }; 
    $rootScope.detail_visible = { value: true }; 
}); 

app.controller('navController', ['$scope', '$rootScope', 
    function ($scope, $rootScope) { 

    $scope.isDetail = $rootScope.detail_visible.value; 
    $scope.url = $rootScope.currentUrl.value; 
    $scope.hide = function($rootScope) { 
     $rootScope.detail_visible.value = false; 
    }; 
}]);

和連接HTML是

<div id="detail_box" ng-class="{d_show: isDetail, d_hide: !isDetail}"> 
    <a href="#" class="box_close" ng-click="hide()"></a> 
    <div ng-include="url + 'detail.html'"></div> 
</div>

從本質上講，我試圖讓這個當你點擊一個縮略圖，它將currentUrl值從'visual/design/1 /'更改爲他們點擊的任何內容（如'music/solo/2'或其他），然後將detail_visible的值更改爲false，以便側邊欄上的類切換我得到了一個不錯的幻燈片，通過ng-include加載了新鮮的內容，這讓我很喜歡比我想象的要多千倍。我一直對此感到震驚，現在已經有三個小時了，每當我有機會的時候，都會在這個應用程序中打破所有其他事情。我在這裏搞砸了什麼？或者，有沒有更好的方法來做到這一點？

我使用全局變量的原因是我在多個控制器中有多個縮略圖，我希望每個人都能夠動態更改我的ng-include中的URL。

來源

2014-10-30 sarsparillo

範圍的對象屬性繼承 - 在你的控制器，你應該能夠修改'$ scope.detail_visible.value'，看看它會影響$ rootScope。儘管如此，你仍然必須在'.run（）'的$ rootScope中初始化它。 – Blazemonger 2014-10-30 16:26:59

請參閱我的想法，但點擊相關鏈接並沒有做任何事情;我想也許我只需要將$ scope.detail_visible更改爲$ rootScope.detail_visible，但它仍然沒有任何作用。我想我的問題可能應該是「爲什麼不這個ng-click實際上工作」 – sarsparillo 2014-10-30 16:30:34

對於你的問題，你用

$rootScope.detail_visible.value = newValue;

引用它改變$ rootScope變量簡單，但你不需要注入$ rootScope給你的函數：

$scope.hide = function() { //without $rootScope 
    $rootScope.detail_visible.value = false; 
};

但是，我會建議你實施一項服務，而不是污染這種任務的根源。

https://docs.angularjs.org/guide/services

來源

2014-10-30 16:30:41

範圍的對象屬性繼承 - 在你的控制器，你應該能夠修改$scope.detail_visible.value，看看它會影響$ rootScope。儘管如此，您仍然必須在.run()的$ rootScope上初始化它。

app.run(function($rootScope) { 
    $rootScope.currentUrl = { value: 'visual/design/1/' }; 
    $rootScope.detail_visible = { value: true }; 
}); 

app.controller('navController', ['$scope', function ($scope, $rootScope) { 

    $scope.hide = function() { // don't need to pass an argument 
     $scope.detail_visible.value = false; 
    }; 
}]);

觀點：

<div id="detail_box" ng-class="{d_show: currentUrl.value, d_hide: !currentUrl.value}"> 
    <a href="#" class="box_close" ng-click="hide()"></a> 
    <div ng-include="currentUrl.value + 'detail.html'"></div> 
</div>

來源

2014-10-30 16:31:48 Blazemonger

AngularJS - 如何修改$ rootScope中的變量？

回答

相關問題