2
イオンモーダルの入力フィールドをクリアするために多くのことを試みました。すでに私は解決策を探していた2日以上が経過しています。誰も私に解決策を提供できますか？私は必要な部分だけを含んでいます。イオンのモーダルビューでデータをクリアする方法
controller.js
.controller('ClientCtrl', ['$scope', '$ionicModal', function($scope, $ionicModal) {
//I have retrieved data form local storage
//$scope.clients contains the data
//client add modal
$ionicModal.fromTemplateUrl('templates/clientAdd.html', {
scope: $scope
}).then(function(modal) {
$scope.clientAdd = modal;
});
// Triggered in the client add modal to close it
$scope.closeClientAddForm = function() {
$scope.clientAdd.hide();
};
// Open the client add modal
$scope.clientAddForm = function() {
$scope.clientAdd.show();
};
}])
.controller('ClientAddCtrl', ['$scope', '$state', function($scope, $state) {
//$scope.client = null;
$scope.client = {};
$scope.addClientData = function(clientData) {
$scope.clientinfo = clientData;
//operation to store data
/* $scope.clearForm = function() {
var client = {
companyName: "",
address: "",
contactName: "",
contactEmail: "",
contactPhone: "",
shippingName: "",
shippingAddress: ""
}
$scope.clientAddForm.$setPristine();
$scope.client = angular.copy(client);
}*/
$scope.closeClientAddForm();
}
}])
モーダル
<ion-modal-view cache-modal-view="false" ng-controller="ClientAddCtrl">
<ion-header-bar class="bar bar-dark">
<h1 class="title">Client Details</h1>
<div class="buttons">
<button class="button button-assertive" ng-click="closeClientAddForm()">Close</button>
</div>
</ion-header-bar>
<ion-content>
<form name="clientAddForm" ng-submit="addClientData(client)" novalidate>
<ion-list>
<div class="padding item-divider">
BILLING DETAILS
</div>
<label class="item item-input">
<span class="input-label">Name <span class="style_error">*</span></span>
<input name="companyName" type="text" ng-model="client.BillingDetails.companyName" required>
</label>
<p class="style_error" ng-show="clientForm.companyName.$dirty && clientForm.companyName.$invalid">Company name is required.</p>
<label class="item item-input">
<span class="input-label">Address 1 <span class="style_error">*</span></span>
<input name="address" type="text" ng-model="client.BillingDetails.address" required>
</label>
<p class="style_error" ng-show="clientForm.address.$dirty && clientForm.address.$invalid">Address is required.</p>
<label class="item item-input">
<span class="input-label">Address 2 </span>
<input name="address2" type="text" ng-model="client.BillingDetails.address2">
</label>
<div class="padding item-divider">
CONTACT DETAILS
</div>
<label class="item item-input">
<span class="input-label">Name <span class="style_error">*</span></span>
<input name="contactName" type="text" ng-model="client.ContactDetails.contactName" required>
</label>
<p class="style_error" ng-show="clientForm.contactName.$dirty && clientForm.contactName.$invalid">Name is required.</p>
<label class="item item-input">
<span class="input-label">Email <span class="style_error">*</span></span>
<input name="contactEmail" type="email" ng-model="client.ContactDetails.contactEmail" required>
</label>
<p class="style_error" ng-show="clientForm.contactEmail.$dirty && clientForm.contactEmail.$invalid">Enter a valid email</p>
<label class="item item-input">
<span class="input-label">Phone <span class="style_error">*</span></span>
<input name="contactPhone" type="number" ng-model="client.ContactDetails.contactPhone" required>
</label>
<p class="style_error" ng-show="clientForm.contactPhone.$dirty && clientForm.contactPhone.$invalid">Phone is required.</p>
<label class="item item-input">
<span class="input-label">Mobile </span>
<input name="contactMobile" type="number" ng-model="client.ContactDetails.contactMobile">
</label>
<label class="item item-input">
<span class="input-label">Fax </span>
<input name="contactFax" type="number" ng-model="client.ContactDetails.contactFax">
</label>
<label class="item item-input">
<span class="input-label">Website </span>
<input name="contactWebsite" type="text" ng-model="client.ContactDetails.contactWebsite">
</label>
<div class="padding item-divider">
SHIPPING DETAILS
</div>
<label class="item item-input">
<span class="input-label">Name <span class="style_error">*</span></span>
<input name="shippingName" type="text" ng-model="client.ShippingDetails.shippingName" required>
</label>
<p class="style_error" ng-show="clientForm.shippingName.$dirty && clientForm.shippingName.$invalid">Shipping name is required.</p>
<label class="item item-input">
<span class="input-label">Address 1 <span class="style_error">*</span></span>
<input name="shippingAddress" type="text" ng-model="client.ShippingDetails.shippingAddress" required>
</label>
<p class="style_error" ng-show="clientForm.shippingAddress.$dirty && clientForm.shippingAddress.$invalid">Shipping Address is required.</p>
<label class="item item-input">
<span class="input-label">Address 2 </span>
<input name="shippingAddress2" type="text" ng-model="client.ShippingDetails.shippingAddress2">
</label>
<div class="padding item-divider">
NOTES
</div>
<ion-item>
<textarea placeholder="notes" name="shippingNotes" ng-model="client.notes" style="width:100%">
</textarea>
</ion-item>
</ion-list>
<button class="button button-block button-positive" type="submit" ng-disabled="clientAddForm.$invalid" >Add Client</button>
</form>
</ion-content>
</ion-modal-view>