Javascript 安格拉斯。在http.get之后显示对象属性
我是新来的Javascript 安格拉斯。在http.get之后显示对象属性,javascript,angularjs,Javascript,Angularjs,我是新来的Angular.js,我在codeschool.com上做了关于angularjs的成型教程,所以如果我试图解决的问题可能太容易解决,请原谅我 因此,我只是试图将从$http.get()获取的数据显示到我的文档中,它是JSON对象 index.html: <!doctype html> <html> <head> <meta charset="utf-8"> <title>League of legends&l
Angular.js
,我在codeschool.com
上做了关于angularjs的成型教程,所以如果我试图解决的问题可能太容易解决,请原谅我
因此,我只是试图将从$http.get()
获取的数据显示到我的文档中,它是JSON
对象
index.html:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>League of legends</title>
<!-- Load StyleSheets -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<!-- Load Javascript Libraries -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</head>
<body ng-app="LeagueOfLegends">
<!-- Navbar menu -->
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div ng-controller="searchSummoner as summoner">
<!-- Search Form -->
<div ng-show="summoner.status.showSearch">
<form ng-submit="summoner.search()">
<div class="well">
<div class="form-group">
<label for="summonerName">Summoner Name</label>
<input type="text" class="form-control" placeholder="Enter Summoner Name" id="summonerName" ng-model="summoner.form.name">
</div>
<div class="form-group">
<label ng-repeat="region in summoner.region">
<input type="radio" ng-model="summoner.form.region" ng-value="region">{{region}}
</label>
</div>
<input type="submit" class="btn btn-default" value="Search"></input>
</div>
</form>
</div>
<p ng-show="summoner.status.showResult">Get request from: {{summoner.data.name}}</p>
</div>
</div>
</body>
成功创建$http.get
后,我创建了一个日志,只是为了检查我检索的数据是否是我需要的数据,但它没有在html中显示对象属性,因为您在错误的闭包中使用了此
。这就是你应该做的:
var that = this;//give controller scope access
// get data from the api rest
$http.get(getApiUrl(form)).success(function(data){
that.data = data[form.name];
console.log(that.data);
});
您还可以像这样绑定上下文:
$http.get(getApiUrl(form)).success(function(data){
this.data = data[form.name];
console.log(this.data);
}.bind(this));
我不太明白。但它似乎是这样工作的,我必须习惯它,我只是不知道用这个值声明一个名为的变量会有什么效果你使用的是成功回调函数,而不是你的控制器,因此,在回调中分配this.data=…
不会在controllerow的data属性中结束。我不知道这是指成功回调函数,谢谢你的解释
$http.get(getApiUrl(form)).success(function(data){
this.data = data[form.name];
console.log(this.data);
}.bind(this));