0

我正在尝试从 JSON 文件加载数据并显示在我的移动应用程序中。但问题是我无法在 member-detail.html 上显示 JSON 数据，应该在哪里显示特定用户的数据。但是在 member-index.html 上，所有用户的完整列表在哪里，我可以正确获取 json 数据。

我有两个页面/模板：

  • member-index.html：包含所有成员的列表。链接到 member-detail.html。JSON数据在这里正确显示：

  • member-detail.html：有关单个成员的详细信息。JSON 数据显示不正确。在这个页面上，我实际上只尝试输出以下两个表达式：

        <h2>Name: {{member.firstname }} {{member.lastname}}</h2>

在这里你可以看看我的文件/data/members.json：

[            
        {
            "id": 1, 
            "lastname": "Doe", 
            "firstname": "John", 
        }
  ]

我正在使用有关文件 services.js 中的 $http.get 函数的服务加载 json 数据。还有两个方法 -> findAll for member-index.html（=工作正常）和 findById -> for member-detail.html（工作不正常，访问 json 对象不起作用，看看这一行：var成员 = 成员 [memberId - 1]):

angular.module('myApp.services', [])

.factory('MemberService', function($http, $q) {

var members = $http.get("data/members.json").success(function(result){
  return result.data;

});

return {
  findAll: function() {
    var deffered = $q.defer();
    deffered.resolve(members);
    return deffered.promise;
  },
  findById: function(memberId) {
    var deferred = $q.defer();
    //members[memberId - 1] --> THIS IS NOT WORKING
    var member = members[memberId - 1];
    deferred.resolve(member);
    return deferred.promise;
  },
}

});

以下控制器用于 member-detail.html：

.controller('MemberDetailCtrl', function($scope, $stateParams, MemberService) {
 MemberService.findById($stateParams.memberId).then(function (member) {
        $scope.member = member;
    });

我的调试工作的结果是，这个问题是在 findById 方法上访问 services.js 中的 JSON 对象。它是以下行：

  • var member = members[memberId - 1]; --> 它返回一个 undefiend

但我不知道如何正确访问成员变量

4

2 回答 2

0

使用以下代码可以在 member-detail.html 中显示特定的成员数据：

服务.js

module.factory('MemberService', function($http, $q) {

  var members =  $http.get("data/members.json");

  return {
    getAll: function(){
        members = members.then(function(result){
        return result;
      })
      var deffered = $q.defer();
      deffered.resolve(members);
      return deffered.promise;
    },
  }
});

MemberService 获取成员数据并在 getAll 方法中返回所有这些数据。

控制器.js

MemberService.getAll().then(function(members){
        angular.forEach(members.data, function(item){
          if (item.id == $stateParams.memberId){
            $scope.member = item;
          }
        })
     });

对于每个成员对象，它会检查 item.id 是否与 $stateParams.memberId 的值相同，如果是，则成员数据将加载到 $scope.member 中。

感谢@artem-petrosian 的精彩提示。

于 2014-05-29T19:22:02.690 回答
0

您可以使用以下方法在members数组中通过 id 找到正确的用户forEach：

var member = {};

angular.forEach(members, function (item) {
    if ( item.id == memberId ) {
        member =  item;
        return;
    }
});

deferred.resolve(member);

return deferred.promise;
于 2014-05-26T05:39:53.523 回答