由函數返回一個文件的內容在角

我有這個短於一身角腳本由函數返回一個文件的內容在角

<script src="http://code.angularjs.org/1.2.14/angular.min.js"></script> 

<script> 
var myApp = angular.module('myApp', []); 

myApp.controller('MainController', ['$scope', '$http', function($scope, $http) { 

    var getContent = function(filename){ 
     var fc = 'empty'; 
     $http.get(filename+'.json').success(function(data) { 
      fc = data; 
     }); 
     return fc; 
    }; 

    $scope.filename = 'file1'; 
    $scope.content = getContent($scope.filename); 
}]); 
</script> 

<div ng-app="myApp" ng-controller="MainController"> 
{{filename}} - {{content}} 
</div>

，並在同一目錄file1.json文件：

[ 
    { 
    "file": "1" 
    } 
]

我不能在getContent處獲取函數以返回文件的內容。我錯在哪裏？

來源

2015-11-12 neptune

你是通過HTTP服務json文件還是隻是你的開發機器上的本地文件？ – shennan

@shennan它是本地的，只是使用了相對路徑 – neptune

'$ http'是異步的，並且你的函數在$'http'的承諾可以將變量變成一個對象之前返回一個原始字符串。 – Claies

$ http.get向服務器發送異步請求。它不會等待迴應。函數getContents繼續並返回'空'。一段時間後，當響應到達時，執行fc = data，但未將其分配給$ scope.content。

取而代之，getContents應該返回一個promise對象，調用者應該有回調函數（在你的例子中，你已經使用'成功'，但that is now deprecated，應該被替換爲'then'）。

這是它如何工作的：

myApp.controller('MainController', ['$scope', '$http', function($scope, $http) { 

     var getContent = function(filename){ 
      return $http.get(filename+'.json'); 
     }; 

     $scope.filename = 'file1'; 
     getContent($scope.filename).then(function(data) { 
      $scope.content = data; 
     }); 
    }]);

來源

2015-11-12 19:51:52

你的函數返回一個承諾，函數本身作爲異步執行的不是結果。

你想要的東西接近：

getContent($scope.filename).then(function(response){ $scope.content = response; });

作爲一個方面說明，這是更好地避免$範圍，並使用controllerAs語法來代替。如果您需要該服務專門提供的功能，則僅使用$ scope。

隨着controllerAs語法,,你可以使用這個在控制器，而不是$範圍，然後在您的視圖中，使用ctrlAs。。

來源

2015-11-12 19:56:04 JMK

由函數返回一個文件的內容在角

回答

相關問題