If I Create/Update/Delete Values in my Array the ng-table is not Updating the Data. I need to do a window.location.reload() for that but thats not very "beautifull". Shouldnt in Angularjs through 2Way DataBinding and Automatic $apply Cycle it do it by it self?
My Code to Review maybe I forgot something:
'use strict';
(function() {
class TranslationsComponent {
constructor($http, $scope, $uibModal) {
this.$http = $http;
this.$scope = $scope;
this.$uibModal = $uibModal;
this.langV = [];
}
$onInit() {// getting my Datas
this.$http.get('/api/dict_keys/all/' + 1 + '/' + 1)
.then(response => {
this.langV = response.data;
});
}
// For Example Deleting something with a Modal
// Delete Modal
deleteKey(selectedKey) {
this.$uibModal.open({
scope: this.$scope,
templateUrl: 'delete.html',
controller: ['$scope', '$uibModalInstance', '$http', 'selectedKey',
function($scope, $uibModalInstance, $http) {
$scope.selectedKey = selectedKey;
this.$http = $http;
$scope.close = function() {
$uibModalInstance.dismiss();
};
$scope.delete = () => {
this.$http.delete('/api/dict_keys/' + selectedKey._id)
.then(() => {
//window.location.reload();
//what can i instead of realod do?
toastr.success('The Key is successfully Deleted');
$uibModalInstance.close();
});
};
}
],
resolve: {
selectedKey: () => selectedKey
}
});
}
/* ----------------------------------------- */
angular.module('euconDictionaryApp')
.component('translations', {
templateUrl: 'app/translations/translations.html',
controller: TranslationsComponent
});
})();
In my .html its a Simple ng-repeat showing everything, in short:
<tr dir-paginate="v in $ctrl.langV |itemsPerPage: 10">
<td>
{{v.Name}}
</td>
<td>
<!-- Delete Key Button -->
<button type="button" class="btn btn-default" ng-click="$ctrl.deleteKey(v)">
</button>
</td>
Looks like you will need to update 'this.langV' array after delete or update in order to see the update. You can use javascript splice method to remove an item from array.
After delete you can use
this.langV.splice(this.langV.indexOf(v), 1)
After update you can update the item like
this.langV[index] = updateItem