如何訪問AngularJS指令中的全局js變量

首先，我查了一下，但沒有發現任何涉及我的問題的文章。如何訪問AngularJS指令中的全局js變量

如何在angularJS內置指令中訪問預定義的js全局變量？

例如，我定義<script>var variable1 = true; </script>

這個變量然後我寫了AngularJS指令：

<div ng-if="variable1">Show some hidden stuff!</div>

這並不真正發揮作用。

然後我得知我應該使用ng-init

所以我寫代碼別的地方，如：

<div ng-init = "angularVariable1 = variable1"></div>

而這顯然不工作，以及...這是一個像惡性循環。你需要訪問預先定義的js全局變量，那麼你需要使用ng-init;爲了使用ng-init，你需要訪問全局變量。

任何特定的方式來做到這一點？

來源

2013-10-15 Allen Nie

我創建了一個working CodePen example，演示如何在AngularJS中以正確的方式執行此操作。因爲直接訪問window會使測試更加困難，所以應該使用Angular $window service來訪問任何全局對象。

HTML：

<section ng-app="myapp" ng-controller="MainCtrl"> 
    Value of global variable read by AngularJS: {{variable1}} 
</section>

的JavaScript：

// global variable outside angular 
var variable1 = true; 

var app = angular.module('myapp', []); 

app.controller('MainCtrl', ['$scope', '$window', function($scope, $window) { 
    $scope.variable1 = $window.variable1; 
}]);

來源

2013-10-15 14:43:11

這應該是最準確的答案！謝謝！可悲的是我必須通過一個控制器來做這種價值分配。 –

這會監視$ window變量並在窗口變量更改時更新範圍變量嗎？ –

@ ogc-nick不，如果$ window.variable1改變'$ scope.variable1'將會過期。 –

將全局變量複製到控制器中作用域中的變量。

function MyCtrl($scope) { 
    $scope.variable1 = variable1; 
}

然後，你可以像你試圖訪問它。但請注意，當您更改全局變量時，此變量不會更改。如果你需要的話，你可以使用全局對象並「複製」。由於它將被引用「複製」，它將是同一個對象，因此將應用更改（但請記住，在AngularJS之外執行操作將需要執行$ scope。$ apply anway）。

但是，如果你想描述你實際嘗試達到的目標，那麼這可能是值得的。因爲使用這樣的全局變量幾乎不是一個好主意，並且可能有更好的方法來達到預期的結果。

來源

2013-10-15 14:29:49

我曾嘗試這些方法，發現他們不爲我的工作需要。在我的情況下，我需要將json呈現的服務器端注入到頁面的主模板中，所以當它加載和角度入口時，數據已經存在並且不必檢索（大數據集）。

，我發現最簡單的解決方法是做到以下幾點：

在你的角度代碼的應用程序，模塊和控制器的定義在一個全球性的javascript值增加外 - 必須要在這個定義之前角的東西定義。

例子：

'use strict'; 

//my data variable that I need access to. 
var data = null; 

angular.module('sample', [])

然後在你的控制器：

.controller('SampleApp', function ($scope, $location) { 

$scope.availableList = []; 

$scope.init = function() { 
    $scope.availableList = data; 
}

最後，你必須初始化一切（爲了事項）：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
    <script src="/path/to/your/angular/js/sample.js"></script> 
    <script type="text/javascript"> 
     data = <?= json_encode($cproducts); ?> 
    </script>

最後初始化控制器和init功能。

<div ng-app="samplerrelations" ng-controller="SamplerApp" ng-init="init();">

通過這樣做，您現在可以訪問任何填入全局變量的數據。

來源

2015-08-12 20:10:32 MediaGiantDesign

如何訪問AngularJS指令中的全局js變量

回答

相關問題