Help in Deleting and Editing in Angle

Question

Help in Deleting and Editing in Angle

Navigation

#1 by (0 votes)
#2 by (0 votes)

2

Good afternoon! I am not able to create the functionality of editing and removing an object from a vector with angular, could someone help me? below is the controller code and the service:

angular.module("appOS").controller("CadastroServicoCtrl",function($scope, Servicos,$location,$timeout){
	
  $scope.servicos = Servicos.listar();
  
  $scope.adicionarServico = function(servico){
    $scope.exibirMsg = false;
    
    var id = $scope.servicos.length;
    servico.codigo = (id + 1);
    Servicos.adicionar(angular.copy(servico));
    delete $scope.servico;
    $scope.servicoForm.$setPristine();
    
      $timeout(function(){
      $scope.exibirMsg = true;
      $scope.mensagem = "Serviço Cadastrado com Sucesso!";
      }, 2000);
      
	};



});

angular.module("appOS").factory("Servicos", function(){
	var servicos = [];
	return {
		listar: function(){
			return servicos;
		},
		adicionar: function(servico){
			
			servicos.push(angular.copy(servico));
			delete servico;
		},
		remover:function(id){
			
		}
	}

});

javascript angularjs

asked by anonymous 25.11.2016 / 15:51

2 answers

Pass a List as a parameter in web services RESTFul Java Difference between pseudo-class (colon :) and pseudo-element (double colon ::) in CSS

score 0 · Answer 1

Here is an example of CRUD with all operations. Although it sounds like a tutorial I believe it's what you need to fix your questions.

var app = angular.module("Aplicacao", []);

app.controller("ControllerCliente", ["$scope",
  function($scope) {
    $scope.clienteSelecionado = {};
    $scope.clientes = [];
    $scope.novoCliente = true;
    console.log("O Controller iniciou.");

    $scope.cadastrar = function() {
      if ($scope.novoCliente) {
        $scope.clientes.push($scope.clienteSelecionado);
      }

      $scope.novoCliente = true;
      $scope.clienteSelecionado = {};
    };

    // Objeto no javascript trabalha com referência
    $scope.selecionar = function(indice) {
      $scope.novoCliente = false;
      $scope.clienteSelecionado = $scope.clientes[indice];
    };

    $scope.excluir = function(indice) {
      $scope.clientes.splice(indice, 1); // Apaga n registros de um vetor a partir de um índice
    };
  }
]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><divng-app="Aplicacao">
  <div ng-controller="ControllerCliente">
    {{clienteSelecionado}}
    <br>
    <form>
      <fieldset>
        <legend>Cadastro de Cliente</legend>

        <div>
          <label for="edtNome">Nome</label>
          <input type="text" name="edtNome" ng-model="clienteSelecionado.nome">
        </div>

        <div>
          <label for="edtSobrenome">Sobrenome</label>
          <input type="text" name="edtSobrenome" ng-model="clienteSelecionado.sobrenome">
        </div>

        <div>
          <button ng-click="cadastrar()">Cadastrar</button>
        </div>
      </fieldset>
    </form>

    {{clientes}}

    <table border=1>
      <thead>
        <tr>
          <th>Nome</th>
          <th>Sobrenome</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="cliente in clientes">
          <td>{{cliente.nome}}</td>
          <td>{{cliente.sobrenome}}</td>
          <td>
            <button ng-click="selecionar($index)">Selecionar</button>
            <button ng-click="excluir($index)">Excluir</button>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

score 0 · Answer 2

I do not know how your application works, but if that factory goes through the injection system because it's called elsewhere, it should end by zeroing its variable, but nothing prevents you from having the methods in the factory.

angular.module("appOS")
.controller("CadastroServicoCtrl",function($scope, arrayFactory){

  var ctrl = this;

  var arr = [];

  arrayFactory.add(arr, "valorAdd");

  arrayFactory.edit(arr, "valorAddModificado", null, "valorAdd"); // Edit por valor
  // arrayFactory.edit(arr, "valorAddModificado", 0, null); Edit por Index

  arrayFactory.remove(arr, null, "valorAddModificado"); // Remove por Valor
  // arrayFactory.remove(arr, 0, null); Remove por Index
});

angular.module("appOS").factory("arrayFactory", function(){
  return {
    add: function (arr, value) {
      arr.push(value);
      return arr;
    },

    edit: function (arr, newValue, index, oldValue) {
      if (index) {
        arr[index] = newValue;
        return arr;
      } else if (oldValue) {
        arr.forEach(function (item) {
          if (item == oldValue) {
            item = newValue;
          }
        });
        return arr;
      }
    },

    remove: function (arr, index, value) {
      if (index) {
        arr.splice(index, 1);
        return arr;
      } else if (value) {
        arr.forEach(function (item, index) {
          if (item == value) {
            arr.splice(index, 1);
          }
        });
        return arr;
      }
    }
  }
});