AngularJS 1.3.5を使用していて、jsonファイルから情報を取得しようとしています。これが私のコードです:HTMLファイル:
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
<script src="js/controllers/MainController.js"></script>
<script src="js/services/myapp.js"></script>
<script src="js/app.js"></script>
<body ng-app="app">
<div ng-controller="MainController">
<div ng-repeat="content in contents">
<a ng-href="{{data.FolderPath}}">{{data.FolderPath}}</a>
</div>
</div>
</body>
</html>
Javascriptファイル:MainController.js
app.controller('MainController', ['$scope', 'myapp', function($scope, myapp) {
myapp.success(function(data) {
$scope.FolderPath = data;
});
}]);
myapp.js
app.factory('myapp', ['$http', function($http) {
return $http.get('C:\Users\nouri\Desktop\configFile.json')
.success(function(data) {
return data;
})
.error(function(err) {
return err;
});
}]);
そして最後にapp.js
var app = angular.module('FolderApp', []);
コードに2つの問題があるようです
スクリプトをロードする順序。app.js、services / myapp.js、controllers /MainController.jsの順にロードします。
<script src="js/app.js"></script>
<script src="js/services/myapp.js"></script>
<script src="js/controllers/MainController.js"></script>
Angularモジュールの名前はFolderAppですが、「app」として参照しています。次のように変更します
<body ng-app="FolderApp">
編集
あなたがあなたの工場を使用している方法に問題があります。APIを呼び出し、$ httppromiseを返すメソッドを含むオブジェクトを返す必要があります。このようなものを試してください:
ファクトリー
app.factory('myapp', ['$http', function($http) {
return {
getJson: function() {
return $http.get('C:\Users\nouri\Desktop\configFile.json');
}
}
}]);
コントローラ
app.controller('MainController', ['$scope', 'myapp', function($scope, factory) {
factory.callApi()
.then(function(data) {
$scope.FolderPath = data;
});
}]);
このフィドラーを見てください。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加