角度使用控制器中的Json數據

我正在關閉此問題，因爲問題已解決，1個問題是我正在使用$scope.data = data（而不是$scope.data = data.data）。另一個原因是因爲我選擇的答案。角度使用控制器中的Json數據

我想要做的是從json文件中獲取數據（一個對象）並將其分配給另一個變量（或$ scope屬性，我想？）。

但是當我這樣做時，我已初始化的對象在$ http.get（）調用發生之前被分配給我的備用變量？

<!DOCTYPE html> 
<html> 
<head> 
    <title>Playing with Angular</title> 
    <script src="angular.min.js"></script> 
</head> 
<body data-ng-app="myApp" ng-controller="myCtrl" ng-init=""> 
    <p>{{ element1 }}</p> 
    <script type="text/javascript"> 
     var app = angular.module('myApp', []); 
     app.controller('myCtrl', function ($scope, $http) { 
      $scope.data = {}; 
      $http.get("data.json").then(function(data) { 
       $scope.data = data.data; 
      }); 
      $scope.element1 = $scope.data.element1; 
     }); 
    </script> 
    </div> 
</body> 
</html>

data.json很簡單：

{ 
    "element1": { 
     "sub1":1, 
     "sub2":2 
    } 
}

上午我試圖做的東西是不可能的角度？如果這個問題已經在其他地方得到解答，請將我指向它。

編輯

更近一步

我改變上述$scope.data = data;到$scope.data = data.data;。這是我最大的問題所在（在我看來，無論如何，由於沒有人看到這一點）。

現在我的問題是，我正在尋找比Narain Mittal建議的更好的解決方案。我可以將$scope.element1 = $scope.data.element1;放置在$http.get("data.json").then(function(data) {});之內，它可以工作。這不是我想要的。

但是我會鞏固我想要的東西，然後轉到代碼審查。感謝所有的幫助！

來源

2016-02-11 Ryan Buchmeier

你需要有內部.then回調函數的聲明$scope.element1 = $scope.data.element1;，像這樣：

$http.get("data.json").then(function(data) { 
     $scope.data = data; 
     $scope.element1 = $scope.data.element1; 
    });

它不爲你工作的原因是JavaScript執行不等待$http調用之前完成除非您將它放在回調中，否則請繼續進行分配。

來源

2016-02-11 23:22:27

這對我不起作用。當我調用data.element1時，它也沒有。 –

NMittal是正確的。在get請求返回之前，您正試圖分配'$ scope'對象的'element1'屬性。如果「這不起作用」，你需要更加努力。你很可能有多個問題。 – Sebas

Sebas我知道我的主要問題是，我想在獲取請求回來之前分配一些東西（我試過工廠和服務來解決這個問題，但我找不到有效的東西）。請不要低估我花費在解決這個問題上的時間。這是我做堆棧溢出的第一篇文章，因爲我無法弄清楚這一點。 –

數據可能是需要解析爲json的字符串。

$scope.data = {} 
$http.get("data.json").then(function(data) { 
    $scope.data = angular.fromJson(data); 
});

我已經編輯了這一點，因爲我想一個更好的選擇是做以上，並有你的模板鑽入數據

<p>{{ data.element1 }}</p>

編輯對不起，這是fromJson

來源

2016-02-11 23:38:38 Jeremythuff

所以實際上，當我在此之前完成時，數據成爲.then調用之後的一個對象。現在它變成了一個字符串而不是一個對象。 –

這將是一個字符串，JSON.parse或angular.toObject應該做的竅門 – Jeremythuff

它實際上來自Json – Jeremythuff

你需要像這樣解析JSON數據

$http.get("data.json").then(function(data) { 
     var data = JSON.parse(data) 
     $scope.element1 = data.element1 
    });

來源

2016-02-12 04:33:33

這給了我一個「SyntaxError：在Object.parse（本地）的意外的標記o」錯誤。 –

您的JSON文件需要JSON格式{ 「部件1」：{ 「SUB1」：1，「SUB2」：2 }} 這 –

是。正如你從我發佈的代碼中看到的那樣。 –

角度使用控制器中的Json數據

回答

相關問題