Você está aqui: AngularJS ::: Angular / AngularJS + JavaScript ::: Controllers AngularJS |
|
Aprenda a criar o seu primeiro controller AngularJS (em JavaScript puro, sem CLI nem TypeScriptQuantidade de visualizações: 1051 vezes |
|
O título desta dica pode ser exagerado, mas é isso mesmo. Mostrarei a seguir como criar o seu primeiro controller AngularJS sem precisar passar pelo processo de escrevê-lo em TypeScript e depois compilá-lo para JavaScript. Além disso, quem está aprendendo AngularJS quer ver alguma coisa logo, e não ficar disparando um monte de comando Angular CLI (Command Line Interface) sem entender muito bem o processo. Então, vamos começar. Um controller AngularJS, no final das contas, é um simples objeto JavaScript usado para controlar os dados e seus fluxos em uma aplicações AngularJS. Abra o seu editor HTML favorito e digite o seguinte código: <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Cadastro de Alunos AngularJS</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script> </head> <body> <script type="text/javascript"> // vamos criar uma nova aplicação var app = angular.module('CadAlunos', []); // vamos criar o controller Aluno app.controller('Aluno', function ($scope){ $scope.nome = "Osmar J. Silva"; $scope.curso = "Sistemas de Imformação"; }); </script> <div ng-app="CadAlunos" ng-controller="Aluno"> <h1>Nome: {{nome}} - Curso: {{curso}}</h1> </div> </body> </html> Ao abrir esta página no navegador você terá o seguinte resultado: Nome: Osmar J. Silva - Curso: Sistemas de Imformação Veja que primeiro nós criamos uma nova aplicação AngularJS chamada "AngularJS" com a linha: var app = angular.module('CadAlunos', []); Em seguida criamos o controller Aluno e passamos a ele o objeto $scope. É ele que nos possibilidade acessar as propriedades e métodos em um controller a partir da view. Em outras dicas desta seção eu mostro como criar métodos (funções) em um controller. Para finalizar, experimente colocar o código para a criação da aplicação AngularJS em um arquivo .js separado. Faça o mesmo com o código do controller. |
|
Link para compartilhar na Internet ou com seus amigos: | |
Anúncio Patrocinado | |
Ruby ::: Dicas & Truques ::: Data e Hora |
Datas e horas em Ruby: Time, Date ou DateTime - Qual classe devo usar?Quantidade de visualizações: 8241 vezes |
A linguagem Ruby oferece três classes básicas para lidar com datas e horas: Time, Date e DateTime. Para ajudá-lo em seus estudos, veja uma descrição breve de cada uma: 1) A classe Time está mais para um encapsulamento das funções de datas e horas da biblioteca C. Estas bibliotecas são geralmente baseadas na época UNIX (UNIX epoch) e, assim, não conseguem representar datas e horas antes de 1970. 2) A classe Date foi criada para superar estas deficiências da classe Time. Com esta classe nós podemos lidar com datas realmente antigas, tais como o aniversário de Leonardo da Vinci (15 de abril de 1452) e, esta classe funciona muito bem com a reforma do calendário. No entanto, a classe Date não permite lidar com horas, ou seja, ao usá-la não seremos capazes de representar a hora que Leonardo da Vinci nasceu. Apenas a data de nascimento. 3) A classe DateTime herda da Date e tenta ser o melhor de ambos os mundos. Com esta classe podemos representar datas da mesma forma que Date e horas da mesma forma que Time. Geralmente os desenvolvedores optam por esta classe, por considerá-la a forma mais correta de representar datas e horas. |
Python ::: Desafios e Lista de Exercícios Resolvidos ::: Estruturas de Controle |
Exercício Resolvido de Python - Como testar se um ano é bissexto em Python - Um programa que lê um ano com quatro dígitos e informa se ele é bissexto ou nãoQuantidade de visualizações: 1024 vezes |
Pergunta/Tarefa: Chama-se ano bissexto o ano ao qual é acrescentado um dia extra, ficando ele com 366 dias, um dia a mais do que os anos normais de 365 dias, ocorrendo a cada quatro anos (exceto anos múltiplos de 100 que não são múltiplos de 400). Isto é feito com o objetivo de manter o calendário anual ajustado com a translação da Terra e com os eventos sazonais relacionados às estações do ano. O último ano bissexto foi 2012 e o próximo será 2016. Um ano é bissexto se ele for divisível por 4 mas não por 100, ou se for divisível por 400. Escreva um programa Python que pede ao usuário um ano com quatro dígitos e informa se ele é bissexto ou não. Sua saída deverá ser parecida com: Informe o ano: 2024 O ano informado é bissexto. Veja a resolução comentada deste exercício usando Python: # método principal def main(): # vamos solicitar que o usuário informe um ano ano = int(input("Informe o ano: ")) # vamos verificar se o ano informado é bissexto if(((ano % 4 == 0) and (ano % 100 != 0)) or (ano % 400 == 0)): print("\nO ano informado é bissexto.\n") else: print("\nO ano informado não é bissexto.\n"); if __name__== "__main__": main() |
C++ ::: Dicas & Truques ::: Matemática e Estatística |
Como calcular porcentagem em C++ - Como efetuar cálculos de porcentagem em C++Quantidade de visualizações: 39524 vezes |
Cálculos de porcentagens estão presentes em boa parte das aplicações que desenvolvemos. Porém, há momentos em que a mente trava e não conseguimos lembrar com clareza como estes cálculos são feitos, principalmente em C++. Esta anotação tem o objetivo de ser uma fonte de pesquisa para os momentos em que suas habilidades matemáticas insistirem em continuar ocultas. Ex: 1 - Suponhamos que um produto que custe R$ 178,00 sofra um acréscimo de 15%. Qual o valor final do produto? Veja o código em C++: // Algoritmo que calcula porcentagem em C++ #include <iostream> using namespace std; // função principal do programa int main(int argc, char *argv[]){ // variáveis usadas na resolução do problema double valor, percentual, valor_final; valor = 178.00; // valor original percentual = 15.0 / 100.0; // 15% valor_final = valor + (percentual * valor); // mostra o resultado cout << "O valor final do produto é: " << valor_final; // O resultado será 204,70 cout << "\n\n"; system("PAUSE"); // pausa o programa return EXIT_SUCCESS; } Ex: 2 - Um produto, cujo valor original era de R$ 250,00, teve um desconto de 8%. Qual foi seu valor final? Veja o código em C++: // Algoritmo que calcula porcentagem em C++ #include <iostream> using namespace std; // função principal do programa int main(int argc, char *argv[]){ // variáveis usadas na resolução do problema double valor, percentual, valor_final; valor = 250.00; // valor original percentual = 8.0 / 100.0; // 8% valor_final = valor - (percentual * valor); // mostra o resultado cout << "O valor final do produto é: " << valor_final; // O resultado será 230,00 cout << "\n\n"; system("PAUSE"); // pausa o programa return EXIT_SUCCESS; } Ex: 3 - Em um concurso de perguntas e respostas, um jovem acertou 72 das 90 perguntas apresentadas. Qual foi a porcentagem de acertos? E a porcentagem de erros? Veja o código em C++: // Algoritmo que calcula porcentagem em C++ #include <iostream> using namespace std; // função principal do programa int main(int argc, char *argv[]){ // variáveis usadas na resolução do problema double perguntas, acertos; perguntas = 90.0; acertos = 72.0; // mostra a porcentagem de acertos cout << "Porcentagem de acertos: " << ((acertos / perguntas) * 100) << "%"; // mostra a porcentagem de erros cout << "\nPorcentagem de erros: " << ((perguntas - acertos) / perguntas) * 100 << "%"; // Os resultados serão 80% e 20% cout << "\n\n"; system("PAUSE"); // pausa o programa return EXIT_SUCCESS; } Ex: 4 - Um aparelho de CD foi adquirido por R$ 300,00 e revendido por R$ 340,00. Qual foi a porcentagem de lucro na transação? Veja o código em C++: // Algoritmo que calcula porcentagem em C++ #include <iostream> using namespace std; // função principal do programa int main(int argc, char *argv[]){ // variáveis usadas na resolução do problema double valor_anterior, novo_valor, porcentagem_lucro; valor_anterior = 300.0; // valor anterior novo_valor = 340.0; // valor novo // calcula a porcentagem de lucro // efetua o cálculo porcentagem_lucro = ((novo_valor * 100) / valor_anterior) - 100; cout << "A porcentagem de lucro foi de: " << porcentagem_lucro << "%"; // O resultado será 13,33 cout << "\n\n"; system("PAUSE"); // pausa o programa return EXIT_SUCCESS; } Ex: 5 - Uma loja repassa 5% do lucro a seus vendedores. Se um produto custa R$ 70,00, qual o valor em reais repassado a um determinado vendedor? Veja o código em C++: // Algoritmo que calcula porcentagem em C++ #include <iostream> using namespace std; // função principal do programa int main(int argc, char *argv[]){ // variáveis usadas na resolução do problema double valor, percentual, comissao; valor = 70.0; // valor do produto percentual = 5.0 / 100.0; // 5% // calcula a comissão comissao = percentual * valor; // mostra o resultado cout << "O valor repassado ao vendedor é: " << comissao; // O resultado será 3,5 cout << "\n\n"; system("PAUSE"); // pausa o programa return EXIT_SUCCESS; } |
Java ::: Dicas & Truques ::: Gráficos |
Como desenhar em um JComponent (JLabel, JButton, JPanel, etc) usando o método getGraphics() para obter o contexto de desenhoQuantidade de visualizações: 13821 vezes |
A classe JComponent possui um método chamado getGraphics() que retorna um objeto da classe Graphics que pode ser usado para desenhar na superfície do componente. Desta forma, qualquer componente que herda de JComponent pode ser usado para esta finalidade. Antes de demonstrarmos como isso funciona, tenha em mente que o contexto de desenho de um componente só está disponível após ele ser pintado pela primeira vez. Se tentarmos obter o Graphics antes que o componente tenha sido pintado, corremos o risco de lançar uma exceção NullPointerException. O trecho de código abaixo mostra como desenhar uma linha em um JLabel ao clicar em um botão. Fique atento a este código. Boa parte das dicas vistas nesta seção usam esta abordagem: import java.awt.*; import java.awt.event.*; import javax.swing.*; public class Estudos extends JFrame{ JLabel label; public Estudos() { super("Desenhando em um JLabel"); Container c = getContentPane(); c.setLayout(new BorderLayout()); // Cria um JLabel label = new JLabel(); c.add(label, BorderLayout.CENTER); // Cria um botão JButton btn = new JButton("Desenhar uma linha"); btn.addActionListener( new ActionListener(){ public void actionPerformed(ActionEvent e){ // Desenha uma linha no JLabel Graphics graphics = label.getGraphics(); graphics.drawLine(0, 0, 150, 100); } } ); // Adiciona o botão à janela c.add(btn, BorderLayout.SOUTH); setSize(350, 250); setVisible(true); } public static void main(String args[]){ Estudos app = new Estudos(); app.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); } } Há algo de interessante neste código. Se você maximizar, minimizar ou redimensionar a janela verá que o desenho é apagado. Isso acontece porque todas as vezes que a janela sofre alguma alteração, ela é pintada novamente, juntamente com seus componentes filhos. Se você deseja que o desenho seja feito automaticamente novamente, é melhor fazer uma sub-classe do componente desejado e sobrescrever seu método paintComponent(). Nesta mesma seção você encontrará exemplos de como fazer isso. |
Java ::: Desafios e Lista de Exercícios Resolvidos ::: Java Básico |
Exercício Resolvido de Java - Um programa Java console ou GUI que receberá a duração de um evento expresso em segundos e exiba-o expresso em horas, minutos e segundosQuantidade de visualizações: 10759 vezes |
Pergunta/Tarefa: Escreva um programa Java console ou GUI que receberá a duração de um evento expresso em segundos e exiba-o expresso em horas, minutos e segundos. Seu programa deverá exibir uma saída parecida com: Informe a duração do evento em segundos: 3712 Duração do evento: 01:01:52 Resposta/Solução: Veja a resolução comentada deste exercício usando Java console (lendo a entrada do usuário por meio do uso da classe Scanner): public static void main(String[] args){ // não se esqueça de adicionar um import para a classe Scanner // import java.util.Scanner; // vamos criar um objeto da classe Scanner Scanner entrada = new Scanner(System.in); // variáveis que vão guardar a duração em horas, minutos e segundos; int horas, minutos, segundos; int duracao_segundos; // guardará a duração em segundos // vamos solicitar a duração do evento em segundos System.out.print("Informe a duração do evento em segundos: "); // vamos ler os segundos informados duracao_segundos = Integer.parseInt(entrada.nextLine()); // vamos obter a quantidade de horas do evento horas = duracao_segundos / 3600; // vamos obter os minutos minutos = (duracao_segundos / 60) % 60; // vamos obter os segundos restantes segundos = duracao_segundos % 60; // vamos exibir a duração do evento em horas, minutos e segundos System.out.printf("Duração do evento: %02d:%02d:%02d\n\n", horas, minutos, segundos); } |
Mais Desafios de Programação e Exercícios e Algoritmos Resolvidos de Java |
Veja mais Dicas e truques de Java |
Dicas e truques de outras linguagens |
Python - Exercícios Resolvidos de Python - Como converter de binário para decimal em Python usando o laço for |
Códigos Fonte |
Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimento Diga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais |
Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidades Tenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais |
Linguagens Mais Populares |
1º lugar: Java |