似乎无法让这种GET方法在AngularJS中正常工作

因此，我构建了一个使用json文件存储项目信息的投资组合页面。出于某种原因，我无法在ng-view上显示任何内容，任何想法都将有所帮助！似乎无法让这种GET方法在AngularJS中正常工作

主页：

<body ng-app="myApp"> 
    <ng-view></ng-view> 
</body>

主要查看HTML：

<div class="container"> 
     <div class="row"> 
     <div ng-repeat="item in appList"> 
      <a ng-href="{{item.link}}"> 
      <img ng-src="{{item.image}}" /> 
      <h4> 
       {{item.title}} 
      </h4> 
      </a> 
     </div> 
     </div> 
    </div>

应用JS：

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

app.config(function($routeProvider){ 
    $routeProvider 
    .when('/',{ 
     controller: "MainController", 
     templateUlr: "main.html" 
    }); 
}) 

app.controller('MainController', function($scope){ 
    $scope.appList = {}; 

    $http({ 
    method: "GET", 
    url:"stuff.json" 
    }).success(function(data){ 
    $scope.appList = data; 
    }) 

})

JSON文件（只是一个例子）：

[{ 
    "title": "Caption 1", 
    "image": "http://placehold.it/450x300?text=Image + 1", 
    "link": "#" 
}, { 
    "title": "Caption 2", 
    "image": "http://placehold.it/450x300?text=Image + 2", 
    "link": "#" 
}, { 
    "title": "Caption 3", 
    "image": "http://placehold.it/450x300?text=Image + 3", 
    "link": "#" 
}]

我怀疑json文件可能存在问题，或者我试图访问它。任何事情在这一点上都会有所帮助。（所有依赖关系都已添加）。

来源

2016-12-13 CMckinstry

你不包括在你的控制器 –

*捂脸*感谢'$ http'服务！这解决了这个问题。 – CMckinstry

这不是templateUlr:取而代之的则是：templateUrl:

您将需要注入$http，它会工作。

这是一个工作solution。

来源

2016-12-13 22:05:07

我意识到，把它固定在Plunkr中，它仍然不显示。 – CMckinstry

它不应该在HTML中的任何地方被引用。这就是路由的用途。 – CMckinstry

@CMckinstry你将需要注入'$ http'，它会起作用。 –

添加$ HTTP到控制器

app.controller('MainController', function($scope,$http){ 
    $scope.appList = {}; 

    $http({ 
    method: "GET", 
    url:"stuff.json" 
    }).success(function(data){ 
    $scope.appList = data; 
    }) 

})

来源

2016-12-13 22:16:05 flakerimi

确定有点晚了:) – flakerimi

似乎无法让这种GET方法在AngularJS中正常工作

回答

相关问题