2015-03-03 50 views
1

我已經編寫了下面的代碼來從輸入字段獲取值並保存它。 我定義了一個全局變量,並將其中的輸出放在app.factory中使用。問題是「x」只能在「更新函數」內部讀取,並且在其外部的任何位置未定義。 我該如何解決這個問題?

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

 
app.controller('bomController', ['$scope', 'appService', '$rootScope', function ($scope, appService, $rootScope) { 
 
    
 
    var get = function() { 
 
     appService.get().then(function (promise) { 
 

 
      $scope.graph = { 
 
       
 
       options: { 
 
        "hierarchicalLayout": { 
 
         "direction": "UD" 
 
         
 
        }, 
 
        "edges": { 
 
         "style":"arrow-center", 
 
         "color":"#c1c1c1" 
 
        }, 
 
        "nodes": { 
 
         "shape":"oval", 
 
         "color":"#ccc" 
 

 
        } 
 
       }, 
 
       
 
       data: { 
 
        nodes: promise.nodes, 
 
        edges: promise.edges 
 
       } 
 
      }; 
 
       
 
      
 
     }); 
 
     
 
    }; 
 
    
 
    $scope.newNode = { 
 
     id: undefined, 
 
     label: undefined, 
 
     level: undefined, 
 
     parent: undefined, 
 
     
 
    }; 
 

 
    $scope.arrNode = {}; 
 
    $scope.update = function (nodes) { 
 
     $scope.arrNode = angular.copy(nodes); 
 
     $rootScope.x = angular.copy(nodes); 
 
     
 
     
 
    }; 
 

 
    
 
    
 
    $scope.newEdge = { 
 
     id: undefined, 
 
     from: undefined, 
 
     to: undefined 
 
     
 
    }; 
 
    
 
    $scope.arrEdge = {}; 
 
    $scope.updateE = function (edges) { 
 
     $scope.arrEdge = angular.copy(edges); 
 
     
 
    }; 
 
    
 
    
 
    get(); 
 
    
 

 
}]); 
 

 

 

 
app.factory('appService', ['$q', '$http', '$rootScope', function ($q, $http, $rootScope) { 
 
    console.log($rootScope.x); 
 
    return { 
 
     get: function (method, url) { 
 
      var deferred = $q.defer(); 
 
      $http.get('data.json') 
 
       .success(function (response) { 
 
        deferred.resolve(response); 
 
        
 
       }) 
 
      return deferred.promise; 
 
      
 
     }, 
 
     
 
     
 
    }; 
 
    
 
}]);

回答

0

var x;僅在控制器本地。它不能在工廠訪問。

大多數情況下,如果你想共享controllers之間的數據,你將它存儲在service。在控制器中共享聲明全局變量也是一種不好的做法

在您的情況下,實際上正在創建一個closure,並且x是一個private變量。它只能在控制器內訪問。

如果您要訪問的變量x服務,然後使用$rootScope

例如:

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

    $scope.update = function (nodes) { 
     $scope.arrNode = angular.copy(nodes); 
     $rootScope.x = angular.copy(nodes); 
    }; 
}); 

在服務:

app.factory('appService', ['$q', '$http', '$rootScope', function ($q, $http, $rootScope) { 
     // you will have access to $rootScope.x 
}); 
+0

謝謝你..我對Angular完全陌生,你可以讓它更清楚一點,以及如何編寫它? – 2015-03-03 10:22:29

+0

更新了我的答案。請檢查 – mohamedrias 2015-03-03 10:32:29

+0

謝謝您的時間,它是可訪問的,但是正在運行console.log()返回以下錯誤:TypeError:無法讀取屬性'x'的未定義 在Object。 (在angular.min.js:27) at c。(angular.min.js:26) at d (angular.min.js:26) at Object.instantiate(angular.min.js:27) at $ get(angular.min.js:50) at angular.min.js:42 at m(angular .min.js:6) at k(angular.min.js:42) – 2015-03-03 10:49:49

0

x聲明的功能之外:fiddle

<div ng-app="app"> 
    <div ng-controller="ctrl"> 
     <button ng-click="fn()">{{x}} click</button> 
    </div> 
</div> 

JS

angular.module("app", []) 
.controller("ctrl", function ($scope, $rootScope) { 
    $scope.x = "hello"; 

    $scope.fn = function() { 
     $scope.x = "world"; 
    } 
}) 
+0

再次未定義功能之外。 – 2015-03-03 10:12:45

+0

@ShadiM。似乎你已經解決了你的問題。添加了一個例子來向你展示我的意思。 – Michelangelo 2015-03-03 19:07:38

0

您可以創建一個全局$scope變量,而不是,$scope.x;

相關問題