不使用$ http.get從json-angularjs調用獲取json數據到外部URL

Question

控制器代碼：

var myApp = angular.module('myApp', []);
myApp.controller('myController', function($scope, $http) {
    $http.get('data.json').then(function(data) {
        $scope.artist = data;
    });
});

html代碼：

<div class="main" ng-controller="myController">

    <ul class="artistlist">

        <li class="artist cf" ng-repeat="x in artist">

            <img ng-src="images/{{x.shortname}}_tn.jpg" alt="Photo of {{x.name}}">

            <div class="info">

                <h2>{{x.name}}</h2>

                <h3>{{x.reknown}}</h3>

            </div>

        </li>

    </ul>

</div>

Answer 1

$http服務具有用於獲取詳細信息的data屬性。

數據 – {string | Object} – 用轉換函數轉換的響應主體

像這樣更改您的控制器代碼

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

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

    $http.get('data.json').then( function(response){
    $scope.artist = response.data;
    });
});

並使用ng-app="myApp"初始化html

Answer 2

試試這個： 您的控制器

var myApp = angular.module('myApp', [])

myApp.controller("myController", ["$scope", "$http", function ($scope, $http) {
    $http.get("data.json").then(
        function (response) { $scope.artist = response.data },
        function (error) { console.log(error) }
    )
}])

確保檢查瀏覽器的控制台