Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

allenprado

Rotas AngularJS

Recommended Posts

Bom Dia

Estou tentando criar os links para novas paginas criadas, porém cadastro as Rotas, Controllers e não funciona.

Estou usando um templante Bootstrap + Angular JS.

Falta alguma alteração?

Lembrando que estou usando Templante Bootstrap, logo as paginas que vem com ele já estão funcionando.

====================================== Arquivo app.js (Rotas) ====================================================

var monarchApp = angular.module('monarchApp', ['ngRoute', 'ngAnimate']);
// configure our routes
monarchApp.config(function($routeProvider) {
$routeProvider
.when('/testes', {
templateUrl : 'pages/teste.hbs',
controller : 'testeController'
})
});
monarchApp.controller('testeController', function($scope) {
});

====================================== Link Para chamada ====================================================

<a href="#testes" title="Form elements">Editar perfil</a>

==========================================================================================================

Compartilhar este post


Link para o post
Compartilhar em outros sites

Muda simm! Fiz uns testes aqui e so para de funcionar quando deixo a rota que ja veio com o templante, assim desse jeito funciona.

.when('/view-profile', {
templateUrl : 'pages/alterar-dados.hbs',
controller : 'alterar-dadosController'
})
Mas se eu alterar para exemplo abaixo para de funcionar !
.when('/alterar-dados', {
templateUrl : 'pages/alterar-dados.hbs',
controller : 'alterar-dadosController'
})

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por Air-Gear
      Olá, na parte de enviar eu conseguir, mas manter até terminar o cadastro eu não conseguir. Eu vou contar toda a história para ficar mais claro possível.
       
      Eu precisei implementar um Upload de qualquer imagem ou PDF na página de solicitar compras. O site utiliza AngularJS, a primeira versão do Angular. Eu tentei fazer sem depender de PHP, mas na internet achava só a parte de Front-End e ninguém sabia fazer no Back-End. Então eu resolvi fazer com PHP mesmo.
       
      Nó código PHP, ele aceita todos as extensões de imagens mais o PDF e é possível envia-los todos de uma vez na quantidade que quiser. Todos os arquivos serão renomeados, contendo no nome o ID do usuário logado pego pela função javascript, o dia do mês, o mês, o ano, o dia da semana, a hora, o minuto, o segundo, se é AM ou PM e uma numeração aleatório. O arquivo PDF vai continuar sendo PDF e todas as imagens serão JPG. No final, todos serão enviados para uma pasta chamada upload.
       
      Só que agora eu preciso jogar de volta para página para salvar os novos nomes dos arquivos para continuar o cadastro da solicitação de compras. Como AngularJS utiliza Javascript, eu tentei usa-lo dentro do PHP utilizando EOF, mas não tive resultado. Eu só consigo com HTML com as diretivas do AngularJS. Na parte do API, nos atributos, eu declarei "nomeArquivo: []," , para salvar os nomes dos arquivos.
       
      Seguem o código.
      <div class="row"> <div class="col-sm-12 col-md-6 "> <div class="upload_form_cont"> <form id="upload_form" enctype="multipart/form-data" method="post" action="/profile-upload"> <div> <div><label for="image_file">Selecione o arquivo de imagem</label></div> <div><input type="file" name="image_file" id="image_file" accept="image/*" onchange="fileSelected();" /></div> </div> <div> <input type="button" value="Upload" onclick="startUploading()" /> </div> <div id="fileinfo"> <div id="filename"></div> <div id="filesize"></div> <div id="filetype"></div> <div id="filedim"></div> </div> <div id="error">Você deve selecionar apenas arquivos de imagem válidos!</div> <div id="error2">Ocorreu um erro ao enviar o arquivo</div> <div id="abort">O upload foi cancelado pelo usuário ou o navegador interrompeu a conexão</div> <div id="warnsize">Seu arquivo é muito grande. Não podemos aceitar isso. Selecione arquivos pequenos</div> <div id="progress_info"> <div id="progress"></div> <div id="progress_percent">&nbsp;</div> <div class="clear_both"></div> <div> <div id="speed">&nbsp;</div> <div id="remaining">&nbsp;</div> <div id="b_transfered">&nbsp;</div> <div class="clear_both"></div> </div> <div id="upload_response"></div> </div> </form> </div> </div> </div> upload.php
      <?php function bytesToSize1024($bytes, $precision = 2) { $unit = array('B','KB','MB'); return @round($bytes / pow(1024, ($i = floor(log($bytes, 1024)))), $precision).' '.$unit[$i]; } //Pega o id do usuário logado $id_url = $_GET['id']; // Numero de campos de upload $numeroCampos = count($_FILES['image_file']['name']); // Tamanho máximo do arquivo (em bytes) $tamanhoMaximo = 1024*1024*2; // Extensões aceitas $extensoes = array(".jpg", "jpeg", ".gif", ".png", ".pdf", ".bmp", ".pdf", ".tiff"); //Local da pasta $_UP['pasta'] = '../upload/'; $substituir = false; for ($i = 0; $i < $numeroCampos; $i++) { // Informações do arquivo enviado $sFileName = $_FILES['image_file']['name'][$i]; $sSize = $_FILES['image_file']['size'][$i]; $sFileSize = bytesToSize1024($sSize, 1); $nomeTemporario = $_FILES['image_file']['tmp_name'][$i]; // Verifica se o arquivo foi colocado no campo if (!empty($sFileName)) { $erro = false; // Verifica se o tamanho do arquivo é maior que o permitido if ($sSize > $tamanhoMaximo) { $erro = "O arquivo " . $sFileName . " não deve ultrapassar " . $tamanhoMaximo. " bytes"; } // Verifica se a extensão está entre as aceitas elseif (!in_array(strrchr($sFileName, "."), $extensoes)) { $erro = "A extensão do arquivo <b>" . $sFileName . "</b> não é válida"; } // Verifica se o arquivo existe e se é para substituir elseif (file_exists($_UP['pasta'] . $sFileName) and !$substituir) { $erro = "O arquivo <b>" . $sFileName . "</b> já existe"; } else{ //Pega a extensão do arquivo $TipoExtensao = pathinfo($sFileName, PATHINFO_EXTENSION); // O arquivo passou em todas as verificações, hora de tentar movê-lo para a pasta // Primeiro verifica se deve trocar o nome do arquivo $unixTime = time(); $timeZone = new \DateTimeZone('America/Sao_Paulo'); $time = new \DateTime(); $time->setTimestamp($unixTime)->setTimezone($timeZone); $formattedTime = $time->format('d-m-Y_l_h-i-s-a'); $aleatorio = rand(); if($TipoExtensao == 'pdf'){ $nome_final = $id_url .'_'. $formattedTime .'_'. $aleatorio .'.pdf'; }else{ $nome_final = $id_url .'_'. $formattedTime .'_'. $aleatorio .'.jpg'; } // Depois verifica se é possível mover o arquivo para a pasta escolhida if (move_uploaded_file($nomeTemporario, $_UP['pasta'] . $nome_final)) { // Upload efetuado com sucesso, exibe uma mensagem e um link para o arquivo echo "Upload do arquivo ".$sFileName." foi efetuado com sucesso!"; echo "</br>"; echo<<<EOF <p>Eu tentei implementar o retorno da página aqui!</p> <p></br></p> <p></br></p> EOF; } else { // Não foi possível fazer o upload, provavelmente a pasta está incorreta echo "Não foi possível enviar o arquivo, tente novamente"; echo "</br>"; } } } else { echo "Selecione algum arquivo de imagem ou PDF para fazero upload."; } } ?>  
    • Por sarge88
      bom dia,
       
      Estou construindo um mapa usando as API do google, já consegui fazer o mapa funcionar e os marcadores que preciso, mas preciso traçar
      uma rota entre esses dois pontos, mas não estou conseguindo. Eu usei a API Directions do google junto com o Javascript mas não deu certo,
      quando o código executa não da nenhum erro, mas também não renderiza o caminho entre os dois pontos.
      Como ainda estou iniciando em javascritp e nunca tinha usado as API's do google fiquei sem saber onde estou errando.
      Abaixo tem o código do javascritp e da API:
      echo "var map;"; echo "var myLatLng = {lat:". $lat['latitude'] . ",". "lng:". $long['longitude'] ."};"; echo "function initMap(){ map = new google.maps.Map(document.getElementById('map'),{ center:myLatLng, zoom: 18 }); var marker = new google.maps.Marker({ position: myLatLng, map: map, title: 'Localização Pet' }); var marker2 = new google.maps.Marker({ position: {lat:-3.2087322 , lng:-52.2137778}, map: map, title: 'Localização Pet' }); var directionsService = new google.maps.DirectionsService();; var directionsDisplay = new google.maps.DirectionsRenderer();; request = { origin: marker2.position, destination: marker.position, travelMode: google.maps.DirectionsTravelMode.DRIVING }; directionsService.route(request, function(response, status){ if(status == google.maps.DirectionsStatus.OK){ directionsDisplay.setMap(map); } }); }" se alguém tiver alguma ideia de onde está o problema agradeço.  Isso faz parte do meu trabalho de faculdade hehehe e acabei travando ai.
      Desde já agradeço.
    • Por ckcesar
      Alguém poderia me ajudar com rotas no Angular cli...
       
      Eu preciso descobrir um evento que trata a seta voltar do Android, exemplo estou na minha home e se eu for na seta do Android eu volto na minha outra tela de navegação e eu não quero que isso aconteça, quando clicar em voltar eu quero que permaneça na mesma home..
       
      As rotas de trocar de tela eu já fiz, o meu problema mesmo é no voltar.
       
       
    • Por JurisCode
      Olá, amigos programadores e administradores de banco de dados.
       
      eu tenho uma base de dados
       
      uma das tabelas com o nome de cidades, sendo que para cada cidade eu atribuí uma sigla de duas letras.
      outra tabela com as rotas das cidades. Por exemplo:
      tudo isso dentro de uma única célula, não são várias colunas. isso porque a quantidade de cidades varia muito.
      no caso do exemplo a rota seria: "guaíra, terra roxa, francisco alves, iporã, cafezal do sul, perobal, umuarama, cruzeiro d'oeste", etc.
       
      no entanto, eu vou colocar duas caixas de seleção. A primeira para selecionar a cidade de origem e a outra para selecionar a cidade de destino.
      Daí vai fazer uma busca nesses itinerários se tem algum itinerário que passa por essas duas cidades.
       
      Até aí tudo bem, bem facinho, o problema é que eu gostaria de mostrar somente a partir da cidade de origem até a cidade de destino. Por exemplo, se em vez de exibir na tela todo o conteúdo daquela célula de gu (guaíra) até lo (londrina) caso a pessoa selecionar de "um" (umuarama, 7ª cidade do itinerário) até ma (maringá, 15ª cidade do itinerário), pegar dos valores de dentro daquela célua apenas a partir de "um" até "ma" e não retornar todas as siglas.
       
      Qualquer alteração na estrutura da base de dados para facilitar o meu trabalho ou qualquer dica para facilitar a programação, eu agradeço.
    • Por marcelobbt
      Eu estou montando um form para editar alguns dados, então uso o PHP/Codeigniter para montar a página com as informações. Acontece que existem umas caixas de escolha que possuem um código em AngularJS para executar uma fórmula e quando coloco o "ng-model", simplesmente some o item que deveria estar marcado.
       
      Segue parte do form abaixo:
      <div class="form-group"> <label>Trajetória:</label> <?php echo form_input(array('type'=>"text", 'class'=>"form-control", 'name'=>'trajetoriaform','id'=>'trajetoriaform'),$riscoBD->__get('trajetoria')); ?> </div> <div class="form-group"> <label>Frequência:</label> <?php echo form_dropdown(array('class'=>"form-control", "ng-model"=>"frequencia", "ng-change"=>"calcRisco()", 'name'=>'frequenciaform','id'=>'frequenciaform'), $frequencia, $riscoBD->__get('frequencia')); ?> </div> <div class="form-group"> <label>Probabilidade:</label> <?php echo form_dropdown(array('class'=>"form-control", "ng-model"=>"probabilidade", "ng-change"=>"calcRisco()", 'name'=>'probabilidadeform','id'=>'probabilidadeform'), $probabilidade, set_value('probabilidadeform')); ?> </div> <div class="form-group"> <label>Severidade:</label> <?php echo form_dropdown(array('class'=>"form-control", "ng-model"=>"severidade", "ng-change"=>"calcRisco()", 'name'=>'severidadeform','id'=>'severidadeform'), $severidade, set_value('severidadeform')); ?> </div> <div class="form-group"> <label>Risco:</label> <?php echo form_input(array('type'=>"text", "ng-value"=>"resultadorisco", 'class'=>"form-control", 'name'=>'riscoform','id'=>'riscoform', "ng-model"=>"risco"),set_value('riscoform')); ?> </div>  
      Quando gera o html, ao colocar para inspecionar o código de uma das caixas o código fica assim:
      <div class="form-group"> <label>Frequência:</label> <select class="form-control" ng-model="frequencia" ng-change="calcRisco()" name="frequenciaform" id="frequenciaform"> <option value="? undefined:undefined ?"></option> <option value="1" selected="selected">Rara</option> <option value="2">Eventual</option> <option value="3">Habitual</option> <option value="4">Permanente</option> </select> </div> Essa linha "4" aparece do angularJS e é o que impede que apareça o valor selected.
       
      Queria saber se tem algum geito de fazer o javascript mostrar o valor que vem do PHP.
       
      Abaixo o script:
      var app = angular.module('risco', []); app.controller('CalculaRisco', function($scope) { $scope.frequencia; $scope.probabilidade; $scope.severidade; $scope.calcRisco = function () { var freq = parseInt ($scope.frequencia); var prob = parseInt ($scope.probabilidade); var sev = parseInt ($scope.severidade); //console.log(sev+' '+prob+' '+freq); risco = freq + prob + sev; if (risco <= 4) { $scope.risco = 'Baixo'; } else if (risco <= 7) { $scope.risco = 'M\u00e9dio'; } else if (risco <= 10) { $scope.risco = 'Alto'; } else { $scope.risco = 'Muito Alto'; } //console.log(risco+$scope.severidade); }; });  
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.