Resetting with angular in an Ionic app

ionic-v1
1

I am trying to make a reset button for my cost estimator I am building using Ionic Framework. Now I have a simple reset from when It was a web app but obviously that does not work with Ionic.

I know i have to use Angular and add a controller etc but I am a rookie when it comes to Angular/Ionic and need some help.

Here is my code for current reset

HTML:

<div><button class="button button-block button-stable" id="resBtn"  value="Reset">Reset</button></div>

JS:

//Reset Button//  
document.forms[0].addEventListener('reset', function() {
document.getElementById('result').innerHTML = '';
document.getElementById('container').innerHTML = '';
document.getElementById('resultPrem').innerHTML = '';
document.getElementById('containerPrem').innerHTML = '';
});

It is resetting this:

 <div id="priceBlock">
 <h2 class="preText" > Standard = <span id="price"></span></h2>
 <h3 id="container">&nbsp</h3>
 <h2 class="preText">Express = <span id="pricePrem" ></span></h2>
 <h3 id="containerPrem">&nbsp</h3>

I know i will have to add something like: ng(refresh) to the button then write a .controller in the app.js but could really do with some advice how to do this.

Any help would be greatly appreciated.

Cheers

Fred

2

Does anyone have any advice re this? I have struggled to make it work so far.

3

You said it in your initial post. You need to add controller, and use scope to reset it.

$scope.estimates = {}

$scope.reset = function() {
  $scope.estimates = {}
}
   <h2 class="preText" > Standard = <span>{{estimate.price}}</span></h2>
   <h3 id="container">&nbsp</h3>
   <h2 class="preText">Express = <span>{{estimate.pricePrem}}</span></h2>
   <h3 id="containerPrem">&nbsp</h3>
   <button ng-click="reset">Reset</button>
4

Sorry but if you want to do it you need to learn basics of Angular

5

Thankyou very much. Yes I am :smile: its all just very new to me but exciting. I will update how I get on.