Angularjs clear input text field

Question

I have this situation:

http://jsfiddle.net/f8erG/48/

With some input text. When i fill the input i can hide them by a button. What i need is that when the input hides all content inside that was typed clear. So when i click "Show" button the input must be empty. I can't using ngIf before someone ask me.

This is the code:

<div ng-controller="myCtrl">
    <button ng-click="hideStuff()">Hide!</button>
    <button ng-click="showStuff()">Show!</button>
    <div ng-repeat="item in inputFileds">
        <input placeholder="{{item.label}}" class="default" ng-hide="hidden" ng-class="{'fade': startFade, 'show': !startFade}" type="text" ng-model="item.value" />
    </div>
</div>

And javascritp

var myApp = angular.module('myApp', []);

myApp.controller("myCtrl", function($scope, $timeout) {
    $scope.hideStuff = function() {
        $scope.startFade = true;
        $timeout(function() {
            $scope.hidden = true;
        }, 700);

    };

    $scope.showStuff = function() {
        $scope.startFade = false;
        $timeout(function() {
            $scope.hidden = false;
        }, 700);

    };


    $scope.inputFileds = [{
        "label": "input1",
        "value": ""
    }, {
        "label": "input2",
        "value": ""
    }, {
        "label": "input3",
        "value": ""
    }, {
        "label": "input4",
        "value": ""
    }];
});

Solution

You can avoid such problems with the right design!

Why do you put configuration data (labels) into the model? Separate them into 2 object, because the labels are static, but the input field values are not. You can then just reset the modal very simple.

$scope.model = {};

That's it - not need to reset every single field!