我正在使用 AngularJS,并且 ngdialog 存在以下问题。
我有一个功能可以打开一个对话框,然后保存对话框表单元素,然后将其显示在表格中。
表格会在不重新加载页面的情况下更新,但要重新打开对话框,则会使用以前的数据。
我想在不重新加载页面的情况下添加新项目。现在我这样做了,但是我必须重新加载页面,因为在重新创建另一个页面时,我会使用上一个对话框中的新数据
var app = angular.module('AlarmsAddOn', ['ngTable', 'ngDialog'])
app.controller('AlarmsAddOnCtrl', function($scope, $http, $filter, ngTableParams, datas, ngDialog, tags, tagIndex, $timeout){
var self=this;
//initializing $scope
$scope.data=datas;
$scope.tagss=tags;
$scope.tagIndex=tagIndex;
$scope.tableParams = new ngTableParams({
page: 1,
count: 10,
filter: {
message: ''
},
sorting: {
tag_id: 'asc'
}
},
{
total: $scope.data.length,
counts:[],
getData: function($defer, params) {
var orderedData = params.sorting() ?
$filter('orderBy')($scope.data, params.orderBy()) :
$scope.data;
params.total(orderedData.length);
$defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
}
});
//edit tag settings
self.edit_addon = function(key){
$http.post('/', key).then(function(results){
if (results.status==201)
{
$scope.typemsg="alert alert-success";
$scope.msgmsg = "The tag settings has been updated. The new Trigger Value is: "+key.value;
$scope.alertmsg = false;
$timeout(function () { $scope.alertmsg = true; }, 2000);
}
else
{
$scope.typemsg="alert alert-danger";
$scope.msgmsg = "Server Error";
$scope.alertmsg = false;
$timeout(function () { $scope.alertmsg = true; }, 2000);
}
});
};
//delete tag settings
self.delete_addon = function(key){
if(confirm("Are you sure to remove the tag settings")){
var url='/'+key.tag_id+'/'+key.trigger;
$http.delete(url).then(function (results) {
console.log(results);
if (results.status==200)
{
for(var i=0; i<$scope.data.length; i++)
{
if($scope.data[i].tag_id == key.tag_id && $scope.data[i].trigger == key.trigger)
{
var p=i;
}
}
$scope.data.splice(p,1);
$scope.tableParams.reload();
$scope.typemsg="alert alert-success";
$scope.msgmsg = "The tag settings of "+key.tag_name+" has been deleted";
$scope.alertmsg = false;
$timeout(function () { $scope.alertmsg = true; }, 2000)
}
else
{
$scope.typemsg="alert alert-danger";
$scope.msgmsg = "Server Error";
$scope.alertmsg = false;
$timeout(function () { $scope.alertmsg = true; }, 2000);
}
});
}
};
//create new tag settings
self.savetag = function () {
$scope.tag=self.tag;
$http.post('/', $scope.tag).then(function (results) {
if (results.status==201)
{
$scope.data.unshift(self.tag);
$scope.tableParams.reload();
// window.location.reload();
}
else
{
}
});
ngDialog.close();
};
//show form to add new tag settings
self.insert_modal_windows_addon = function()
{
ngDialog.open({ template: '/assets/insert.html', controller: 'AlarmsAddOnCtrl', scope: $scope, cache: false});
};
});
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h3>Add New Tag</h3>
<form name="tag_form" ng-submit="AOC.savetag()" >
<select class="form-control" name="tagid" placeholder="Tag Id" ng-model="AOC.tag.tag_id">
<option value="" disabled selected>Tag Name</option>
<option ng-repeat="k in tagss" value="{{k}}">{{tagIndex[k]}}</option>
</select>
<select class="form-control" name="tagtriggertype" placeholder="Trigger Type" ng-model="AOC.tag.trigger" style="margin:20px auto;">
<option value="" disabled selected style="color:#333;">Trigger Type</option>
<option value="hight">hight</option>
<option value="low">low</option>
</select>
<input type="number" class="form-control" name="tagtriggervalue" placeholder="Trigger Value" ng-model="AOC.tag.value", style="margin:20px auto;"/>
<button class="btn btn-sm btn-primary" type="submit">
<span class="glyphicon glyphicon-floppy-save"></span>
Submit
</button>
</form>
</div>
</body>
</html>