使用隨機用戶生成器使用angular.js創建配置文件
[英]Using Random User generator to create profiles with angular.js
問題描述
我正在嘗試使用RUG（隨機用戶生成器）API來完成此操作，但是我無法使其正常工作。 我應該在點擊事件后調用http請求，但似乎不起作用。 這是我所做的（對不起，我的業余代碼）：
index.html
<!DOCTYPE html>
<html lang="en" ng-app>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body>
<div id="clk" style="background-color: indigo; widht: 100px; height: 100px"></div>
{{"Hello world"}}
<div ng-controller="firstController">
{{ store.email}}
</div>
<script type="text/javascript" src="app.js"></script>
</body>
</html>
app.js
var app = angular.module('people', []);
app.controller('firsController', ["http",function (http) {
var store = this;
store.products = [];
$http.get('http://api.randomuser.me').success(function(data){
store.products = data.results[0].user;
})
}]);
要么
var boton = document.getElementById('clk');
boton.addEventListener('click', function () {
$.ajax({
url: 'http://api.randomuser.me/',
dataType: 'json',
success: function(data){
console.log(data.results[0].user);
}
});
});
兩者都不行。 我可以使用此功能，單擊按鈕並從api加載新用戶並將其與angular一起使用嗎？
1 個解決方案
解決方案1
2 已采納 2015-02-27 06:10:02
這是使用$http服務和作用域變量的正確方法 。
<html ng-app="people">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module('people', []);
app.controller('firstController', ["$scope", "$http", function ($scope, $http) {
$scope.store = {};
$scope.store.products = [];
$http.get('http://api.randomuser.me').success(function(data){
$scope.user = data.results[0].user;
})
}]);
</script>
</head>
<body>
<div id="clk" style="background-color: indigo; widht: 100px; height: 100px"></div>
<div ng-controller="firstController">
{{ user.email}}
</div>
</body>
</html>
無法使用Angular.js在文件名中添加隨機數
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.