I am currently in the process of self-teaching how to construct an Angular/Ionic application. To store JSON, I am utilizing Backand and aiming to retrieve a random JSON value each time the page is refreshed.
An issue I am facing is that the random call function triggers every time I input text. The reason for this behavior eludes me.
index.html
<label class="item-input-wrapper">
<input type="text" placeholder="New Todo" ng-model="input.name">
</label>
<div>
<p class="challenge-text">
{{challenges[randomChallenge(challenges.length)].name}}
</p>
</div>
app.js
.controller('AppCtrl', function($scope, ViewChallenges) {
$scope.challenges = [];
$scope.suggested = [];
$scope.input={};
$scope.randomChallenge = function(length){
return Math.floor(Math.random() * length);
}
function getAllChallenges() {
ViewChallenges.getChallenges()
.then(function (result) {
$scope.challenges = result.data.data;
});
}
$scope.suggestChallenge = function(){
ViewChallenges.suggestChallenge($scope.input)
.then(function(result){
$scope.input = {};
getAllChallenges();
})
}
getAllChallenges();
})
.service('ViewChallenges', function ($http, Backand) {
var baseUrl = '/1/objects/';
var challenges = 'challenges/';
var suggestedChallenge = 'suggested/'
function getUrl(x) {
return Backand.getApiUrl() + baseUrl + x;
};
getChallenges = function () {
return $http.get(getUrl(challenges));
};
suggestChallenge = function(suggested){
return $http.post(getUrl(suggestedChallenge), suggested)
}
return {
getChallenges: getChallenges,
suggestChallenge: suggestChallenge
}
});