Question

我从输入字段中获取用户名并将其作为参数发送到searchUser函数。返回带有更多对象值的用户名。

所以，如果我在输入字段中发送'daveeeeeed'并提交，那么它会发回

{"daveeeeeed":{"id":30155374,"name":"daveeeeeed","profileIconId":577,"summonerLevel":30,"revisionDate":1443840218000}}

所以在我的html文档中，我正在尝试访问res.'daveeeeeed'.name以打印出请求中的名称。但显然{{res.username.name}}无效。在javascript中我无法使用$ scope.res = data.username.name。

我的问题是;如何使用对象中的变量？离。

我的目标 res.username.name //用表格中发送的内容替换用户名

<form>
 <input type="text" ng-model="username" placeholder="username" name="username" />
 <button ng-click="searchUser(username)" class="btn btn-primary">Submit</button>
</form>
{{ res }}

这是javascipt

 $scope.searchUser = function(username){

   $http.get('https://na.api.pvp.net/api/lol/na/v1.4/summoner/by-name/' + username + '?api_key=<key>').
    success(function(data) {
        $scope.res = data;
    }).error(function(err) {
        $scope.res = "User not found";
    });
}

Answer 1

添加评论答案：

您可以在进行http调用之前将用户名添加到$ scope。然后，您可以在DOM模板中访问它，例如{{res [username]}}。

所以你的代码应该是这样的：

$scope.searchUser = function(username){

  $scope.username = username; // Notice this change

  $http.get('https://na.api.pvp.net/api/lol/na/v1.4/summoner/by-name/' + username + '?api_key=<key>').
    success(function(data) {
      $scope.res = data;
    }).error(function(err) {
      $scope.res = "User not found";
    }
  );
}

模板应如下所示：

{{ res[username] }}

Answer 2

你可以用两种方式做到 -

方法1： 返回结果时，请将对象的属性设为静态值（例如，不要发送 daveeeeeed ，发送用户）。

{"user":{"id":30155374,"name":"daveeeeeed","profileIconId":577,"summonerLevel":30,"revisionDate":1443840218000}}

这样，您可以将名称显示为：

<div> {{res.user.name}} </div>

方法2 如果按照自己的方式，

<div> {{res[username].name}} </div>

对象引用中的变量

2 个答案: