Angular JS，从json读取离子[重复]答案

【问题标题】：Angular JS, ionic reading from json [duplicate]Angular JS，从json读取离子[重复]
【发布时间】：2014-11-03 13:00:22
【问题描述】：

我正在使用 IONIC 框架和 Angular JS 构建一个应用程序，我正在使用 ionic 发布的 Tinder 卡片功能 (http://ionicframework.com/blog/tinder-for-x/)。我正在尝试从 JSON 文件中读取并将此 json 文件用作我的数组的存储。我该怎么做，下面是我的普通数组代码

//Controller for Cards
angular.module('Pinder').controller('CardsCtrl', function($scope, TDCardDelegate) {
console.log('CARDS CTRL');

//Array of Cards - this should be moved to a service file.
var cardTypes = [
 {id: 1, title: "Frank", image: 'img/Frank.png', desc:"This will be card Description", done: false },
 {id: 2, title: "John Lewis", image: 'img/JohnLewis.png', desc:"This will be card Description", done: true },
 {id: 3, title: "Generali", image: 'img/Generali.png', desc:"This will be card Description", done: true },
];

//Calls CardTypes array into 'cards'
$scope.cards = Array.prototype.slice.call(cardTypes, 0);

$scope.cardDestroyed = function(index) {
  $scope.cards.splice(index, 1);
};

//Randomly adds a new card 
$scope.addCard = function() {
  var newCard = cardTypes[Math.floor(Math.random() * cardTypes.length)];
  newCard.id = Math.random();
  $scope.cards.push(angular.extend({}, newCard));
 }
})

//Controller for swipe interface of the card.
.controller('CardCtrl', function($scope, TDCardDelegate) {

//Card swipe left function
 $scope.cardSwipedLeft = function(index) {
  console.log('LEFT SWIPE');
 $scope.addCard();
};

//Card swipe right function
$scope.cardSwipedRight = function(index) {
  console.log('RIGHT SWIPE');
  $scope.cards[index].done = true;
  $scope.addCard();
 };
})

这是我试图从 json 文件中读取的代码

//Controller for Cards
angular.module('Pinder').controller('CardsCtrl', function($scope, TDCardDelegate, $http) {
console.log('CARDS CTRL');

$scope.cards = [];
$http.get('../cards.json', function(cardTypes){
    //Calls CardTypes array into 'cards'
    $scope.cards = Array.prototype.slice.call(cardTypes, 0);
 }, function(error) {
 //handle error here
 });

});

$scope.cardDestroyed = function(index) {
$scope.cards.splice(index, 1);
};

//Randomly adds a new card 
$scope.addCard = function() {
  var newCard = cardTypes[Math.floor(Math.random() * cardTypes.length)];
  newCard.id = Math.random();
$scope.cards.push(angular.extend({}, newCard));
 }
})

//Controller for swipe interface of the card.
.controller('CardCtrl', function($scope, TDCardDelegate) {

//Card swipe left function
$scope.cardSwipedLeft = function(index) {
console.log('LEFT SWIPE');
$scope.addCard();
};

//Card swipe right function
$scope.cardSwipedRight = function(index) {
 console.log('RIGHT SWIPE');
 $scope.cards[index].done = true;
 $scope.addCard();
 };
 })

当使用 json 方法时，我得到错误 CardsCtrl is not a function。

【问题讨论】：

您遇到了语法错误。 //handle error here 之后有两个});，而您只需要一个来关闭语句。
啊不敢相信我没有看到。即使使用正确的语法，它仍然不会从我的 json 文件中读取

标签： javascript json angularjs ionic-framework

【解决方案1】：

语法不正确，我有时会忘记使用哪个。 $http.get() 返回一个带有 success 和 error 方法的承诺。

$http.get('../cards.json').success(function(cards){
  console.log(cards);
}).error(function(error) {
  console.log(error);
});

【讨论】：