├── .DS_Store ├── LICENSE ├── README.md ├── class-01 ├── .ignore ├── class-01-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-01-resolved-DevIgor-Igor-Oliveira.md ├── class-01-resolved-MagnumCortez-Magnum-Cortez.md ├── class-01-resolved-Ronaiza-Cardoso.md ├── class-01-resolved-amandavilela-AmandaVilela.md ├── class-01-resolved-cashnojohnny-Andre-Ferreira.md ├── class-01-resolved-cerezini-Mateus-Cerezini-Gomes.md ├── class-01-resolved-davidwillian-DavidWillian.md ├── class-01-resolved-ednilsonamaral-Ednilson-Amaral.md ├── class-01-resolved-gpanassol-Gabriel-Panassol-Fonseca.md ├── class-01-resolved-gustavocardoso-Gustavo-Cardoso.md ├── class-01-resolved-gustavoprado013-gustavo-prado.md ├── class-01-resolved-hc3-Eliel-das-Virgens.md ├── class-01-resolved-ingridrauany-Ingrid-Rauany-Dias-Soares.md ├── class-01-resolved-joseasousa-jose-alves.md ├── class-01-resolved-marcommas-Marco-Comassetto.md ├── class-01-resolved-ronal2do-Ronaldo-Lima.md ├── class-01-resolved-tiamatpontal-Carlos-Alberto-Araujo-Barreto.md ├── class-01-resolved-underzzoo-samuel-desconsi.md ├── class-01-resolved-valdir-pereira-Valdir-Pereira.md ├── class-01-resolved-vitorcapretz-Vitor-Capretz.md ├── costaceta │ ├── class-01-resolved-costaceta-Francisco-Rafael-de-Castro-Costa.md │ ├── css │ │ └── style.css │ └── index.html ├── gkal19 │ ├── class-01-resolved-gkal19-Gabriel-Kalani.md │ └── index.html ├── nicors │ ├── class-01-resolved-nicors-Nicolas-Rafael-Serrato.md │ └── index.html ├── paulinhoerry │ └── class-01-resolved-paulinhoerry-Paulo-Rodrigues.md ├── tuchedsf │ ├── class-01-resolved-tuchedsf-Diego-Ferreira.md │ └── index.html └── willianlauber │ ├── class-01-resolved-Willian-Lauber.md │ └── index.html ├── class-02 ├── .ignore ├── class-02-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-02-resolved-MagnumCortez-Magnum-Cortez.md ├── class-02-resolved-Ronaiza-Cardoso.md ├── class-02-resolved-amandavilela-AmandaVilela.md ├── class-02-resolved-cashnojohnny-Andre-Ferreira.md ├── class-02-resolved-cerezini-Mateus-Cerezini-Gomes.md ├── class-02-resolved-davidwillianx-DavidWIllian.md ├── class-02-resolved-gustavoprado013-gustavo-prado.md ├── class-02-resolved-hc3-Eliel-das-Virgens.md ├── class-02-resolved-ingridrauany-Ingrid-Rauany-Dias-Soares.md ├── class-02-resolved-joseasousa-jose-alves.md ├── class-02-resolved-ronal2do-Ronaldo-Lima.md ├── class-02-resolved-tiamatpontal-CarlosAlbertoAraujoBarreto.md ├── class-02-resolved-valdir-pereira-Valdir-Pereira.md ├── class-02-resolved-vitorcapretz-Vitor-Capretz.md ├── gkal19 │ ├── class-02-resolved-gkal19-Gabriel-Kalani.md │ ├── index1.html │ ├── index2.html │ └── index3.html ├── nicors │ ├── class-02-resolved-nicors-Nicolas-Rafael-Serrato.md │ └── index.html ├── paulinhoerry │ └── class-02-resolved-paulinhoerry-Paulo-Rodrigues.md └── willianlauber │ ├── class-02-resolved-willianlauber-Willian-Lauber.md │ ├── ex1.html │ ├── ex2.html │ └── ex3.html ├── class-03 ├── class-03-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-03-resolved-MagnumCortez-Magnum-Cortez.md ├── class-03-resolved-Ronaiza-Cardoso.md ├── class-03-resolved-amandavilela-AmandaVilela.md ├── class-03-resolved-cerezini-Mateus-Cerezini-Gomes.md ├── class-03-resolved-gustavoprado013-gustavo-prado.md ├── class-03-resolved-hc3-Eliel-das-Virgens.md ├── class-03-resolved-ingridrauany-Ingrid-Rauany-Dias-Soares.md ├── class-03-resolved-joseasousa-jose-alves.md ├── class-03-resolved-ronal2do-Ronaldo-Lima.md ├── class-03-resolved-tiamatpontal-CarlosAlbertoAraujoBarreto.md ├── class-03-resolved-valdir-pereira-Valdir-Pereira-Junior.md ├── gkal19 │ ├── class-03-resolved-gkal19-Gabriel-Kalani.md │ └── index.html ├── nicors │ ├── class-03-resolved-nicors-Nicolas-Rafael-Serrato.md │ └── index.html ├── paulinhoerry │ └── class-03-resolved-paulinhoerry-Paulo-Rodrigues.md └── willianlauber │ ├── class-03-resolved-willianlauber-Willian-Lauber.md │ └── ex1.html ├── class-04 ├── class-04-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-04-resolved-MagnumCortez-Magnum-Cortez.md ├── class-04-resolved-Ronaiza-Cardoso.md ├── class-04-resolved-amandavilela-AmandaVilela.md ├── class-04-resolved-cerezini-Mateus-Cerezini-Gomes.md ├── class-04-resolved-gustavoprado013-gustavo-prado.md ├── class-04-resolved-ingridrauany-Ingrid-Rauany-Dias-Soares.md ├── class-04-resolved-joseasousa-jose-alves.md ├── class-04-resolved-ronal2do-Ronaldo-Lima.md ├── class-04-resolved-tiamatpontal-CarlosAlbertoAraujoBarreto.md ├── gkal19 │ ├── class-04-resolved-gkal19-Gabriel-Kalani.md │ └── index.html ├── hc3 │ ├── class-04-resolved-hc3-Eliel-das-Virgens.md │ └── index.html ├── nicors │ ├── class-04-resolved-nicors-Nicolas-Rafael-Serrato.md │ └── index.html ├── paulinhoerry │ └── class-04-resolved-paulinhoerry-Paulo-Rodrigues.md └── willianlauber │ ├── class-04-resolved-willianlauber-WILLIAN-ALBERTO-LAUBER.md │ ├── ex1.html │ ├── ex2.html │ └── ex3.html ├── class-05 ├── class-05-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-05-resolved-MagnumCortez-Magnum-Cortez.md ├── class-05-resolved-Ronaiza-Cardoso.md ├── class-05-resolved-amandavilela-AmandaVilela.md ├── class-05-resolved-gustavoprado013-gustavo-prado.md ├── class-05-resolved-ingridrauany-Ingrid-Rauany-Dias-Soares.md ├── class-05-resolved-joseasousa-jose-alves.md ├── class-05-resolved-ronal2do-Ronaldo-Lima.md ├── ednilsonamaral │ ├── class-05-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── gkal19 │ ├── class-05-resolved-gkal19-Gabriel-Kalani.md │ └── index.html ├── hc3 │ ├── class-05-resolved-hc3-Eliel-das-Virgens.md │ └── index.html ├── nicors │ ├── class-05-resolved-nicors-Nicolas-Rafael-Serrato.md │ └── index.html ├── paulinhoerry │ └── class-05-resolved-paulinhoerry-Paulo-Rodrigues.md └── willianlauber │ ├── class-05-resolved-willianlauber-Willian-Alberto-Lauber.md │ └── index.html ├── class-06 ├── class-06-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-06-resolved-MagnumCortez-Magnum-Cortez.md ├── class-06-resolved-amandavilela-AmandaVilela.md ├── class-06-resolved-gustavoprado013-gustavo-prado.md ├── class-06-resolved-joseasousa-jose-alves.md ├── class-06-resolved-ronaiza-cardoso.md ├── ednilsonamaral │ ├── class-06-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── gkal19 │ ├── class-06-resolved-gkal19-Gabriel-Kalani.md │ └── index.html ├── hc3 │ ├── class-06-resolved-hc3-Eliel-das-Virgens.md │ └── index.html ├── igopdm │ ├── class-06-resolved-IgoMedeiros-Igo-Medeiros.md │ └── ex06.html ├── paulinhoerry │ └── class-06-resolved-paulinhoerry-Paulo-Rodrigues.md └── willianlauber │ ├── class-06-resolved-willianlauber-WILLIAN-ALBERTO-LAUBER.md │ └── index.html ├── class-07 ├── class-07-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-07-resolved-MagnumCortez-Magnum-Cortez.md ├── class-07-resolved-amandavilela-AmandaVilela.md ├── class-07-resolved-joseasousa-jose-alves.md ├── ednilsonamaral │ ├── class-07-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── gkal19 │ ├── class-07-resolved-gkal19-Gabriel-Kalani.md │ └── index.html ├── hc3 │ ├── class-07-resolved-hc3-Eliel-das-Virgens.md │ └── index.html └── willianlauber │ ├── class-07-resolved-willianlauber-Willian-Alberto-Lauber.md │ └── index.html ├── class-08 ├── class-08-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-08-resolved-MagnumCortez-Magnum-Cortez.md ├── class-08-resolved-joseasousa-jose-alves.md ├── ednilsonamaral │ ├── class-08-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── gkal19 │ ├── class-08-resolved-gkal19-Gabriel-Kalani.md │ ├── index.html │ └── ng-animation.css ├── hc3 │ ├── class-08-resolved-hc3-Eliel-das-Virgens.md │ ├── index.html │ └── ng-animation.css └── willianlauber │ ├── class-08-resolved-willianlauber-WILLIAN-ALBERTO-LAUBER.md │ └── index.html ├── class-09 ├── class-09-resolved-AlexMCoder-Alex-Morgado-Pereira.md ├── class-09-resolved-MagnumCortez-Magnum-Cortez.md ├── ednilsonamaral │ ├── class-09-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── gkal19 │ ├── class-09-resolved-gkal19-Gabriel-Kalani.md │ ├── index.html │ └── ng-animation.css └── willianlauber │ ├── class-09-resolved-willianlauber-Willian-Alberto-Lauber.md │ └── index.html ├── class-10 ├── alexmcoder │ ├── class-10-resolved-AlexMCoder-Alex-Morgado-Pereira.md │ └── index.html ├── ednilsonamaral │ ├── class-10-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── gkal19 │ ├── class-10-resolved-gkal19-Gabriel-Kalani.md │ ├── error.png │ ├── index.html │ ├── ng-animation.css │ └── searchicon.png ├── magnumcortez │ ├── class-10-resolved-MagnumCortez-Magnum-Cortez.md │ └── index.html └── willianlauber │ ├── class-10-resolved-willianlauber-Willian-Lauber.md │ └── index.html ├── class-11 ├── alexmcoder │ ├── class-11-resolved-AlexMCoder-Alex-Morgado-Pereira.md │ └── index.html ├── ednilsonamaral │ ├── class-11-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio.html ├── magnumcortez │ ├── class-11-resolved-MagnumCortez-Magnum-Cortez.md │ └── index.html └── willianlauber │ ├── class-11-resolved-willianlauber-Willian-Alberto-Lauber.md │ └── index.html ├── class-12 ├── ednilsonamaral │ ├── app.js │ ├── class-12-resolved-ednilsonamaral-Ednilson-Amaral.md │ ├── exercicio.html │ └── styles.css └── magnumcortez │ ├── class-12-resolved-MagnumCortez-Magnum-Cortez.md │ └── index.html ├── class-13 └── ednilsonamaral │ ├── app.js │ ├── class-13-resolved-ednilsonamaral-Ednilson-Amaral.md │ ├── exercicio.html │ └── styles.css ├── class-14 ├── ednilsonamaral │ ├── app.js │ ├── class-14-resolved-ednilsonamaral-Ednilson-Amaral.md │ ├── exercicio.html │ └── styles.css └── gkal19 │ ├── class-14-resolved-gkal19-Gabriel-Kalani.md │ ├── error.png │ ├── index.html │ ├── ng-animation.css │ └── searchicon.png ├── class-15 └── ednilsonamaral │ ├── class-15-resolved-ednilsonamaral-Ednilson-Amaral.md │ ├── exercicio01 │ ├── app.js │ ├── index.html │ ├── styles.css │ └── views │ │ ├── user-details.html │ │ └── users.html │ └── exercicio02 │ ├── app.js │ ├── index.html │ ├── styles.css │ └── views │ ├── user-details.html │ └── users.html ├── class-16 └── ednilsonamaral │ ├── class-16-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio │ ├── assets │ ├── css │ │ └── styles.css │ ├── img │ │ └── .keep │ └── js │ │ ├── app.js │ │ └── users.js │ ├── index.html │ └── views │ ├── user-details.html │ ├── user-edit.html │ └── users-list.html ├── class-17 ├── ednilsonamaral │ ├── class-17-resolved-ednilsonamaral-Ednilson-Amaral.md │ └── exercicio │ │ ├── assets │ │ ├── css │ │ │ └── styles.css │ │ ├── img │ │ │ └── .keep │ │ └── js │ │ │ ├── app.js │ │ │ └── users.js │ │ ├── index.html │ │ └── views │ │ ├── user-details.html │ │ ├── users-github.html │ │ └── users-list.html └── gkal19 │ ├── assets │ ├── css │ │ └── styles.css │ ├── img │ │ └── .keep │ └── js │ │ ├── app.js │ │ └── users.js │ ├── class-17-resolved-gkal19-Gabriel-Kalani.md │ ├── index.html │ ├── ng-animation.css │ └── views │ ├── user-details.html │ ├── users-github.html │ └── users-list.html ├── md.md └── md2.md /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/.DS_Store -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016 WebSchool.io 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [Grupo do Telegram](https://telegram.me/joinchat/BJ_gtz49o2OSzTU90SKp-A) 2 | 3 | Para entrar no grupo oficial do Be mean no Telegram basta seguir o link [https://telegram.me/joinchat/BJ_gtz49o2OSzTU90SKp-A](https://telegram.me/joinchat/BJ_gtz49o2OSzTU90SKp-A), lembrando que só é permitido postagens e discussões sobre dúvidas e/ou assuntos pertinentes ao curso, aquele que não respeitar essas regras será banido. 4 | 5 | # Sorteio de LIVRO 6 | 7 | Caso você seja APOIADOR, com $, poderá participar do nosso sorteio MENSAL de 1 livro da [Novatec](http://novatec.com.br). 8 | 9 | O livro desse mês é o [Introdução ao AngularJS](http://www.novatec.com.br/livros/introangularjs/) 10 | 11 | Para participar se cadastre em: [Sorteio LIVRO - Introdução ao AngularJS da Novactec - 15 de MAIO](http://goo.gl/forms/S0yzy7JzNA) 12 | 13 | # O Envio 14 | 15 | Caso você faça um `pull` antes de fazer o seu `Pull Request` por favor **COMITE APENAS SUA PASTA, NÃO FAÇA `git add .`!!** 16 | 17 | **Faça:** 18 | - **Crie uma pasta dentro de class-X com o seu githuser e dentro coloque sua resposta em Markdown e seus arquivos utilizados** 19 | - `git add nome_da_pasta` 20 | - `git commit -m 'SEU NOME - Angular 1 - Exercício XX resolvido'` 21 | - `git push origin master` 22 | 23 | # Padrão do arquivo 24 | 25 | Favor sempre usar: **class-X-resolved-githubuser-nome-completo-com-hifens.md** 26 | 27 | class-01-resolved-suissa-Jean-Carlo-Nascimento.md 28 | 29 | E no início da resposta do Markdown use: 30 | 31 | Nome: (seu nome) 32 | 33 | Github: (link para eu perfil) 34 | 35 | Data: (timestamp da data entregue) 36 | 37 | **NENHUM ARQUIVO FORA DESSE PADRÃO SERÁ ACEITO!!!** 38 | 39 | ## Caso você envie fora dos padrões MÍNIMOS seu PR será negado! Não esqueça da DATA em TIMESTAMP!!!! 40 | 41 | 42 | # Prazo 43 | 44 | O prazo final é antes de entregar o **seu** projeto final, que também não tem um prazo final, pois o curso acontecerá sem um tempo definido devido aos futuros alunos. 45 | 46 | ## Obrigatório entregar **TODOS** antes do seu projeto final. 47 | -------------------------------------------------------------------------------- /class-01/.ignore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-01/.ignore -------------------------------------------------------------------------------- /class-01/class-01-resolved-AlexMCoder-Alex-Morgado-Pereira.md: -------------------------------------------------------------------------------- 1 | # 1 - Explique qual é a definição de MVC, MVVM e MVP 2 | 3 | ## MVC: 4 | * Model: Responsável pela leitura e escrita dos dados. Podemos realizarManipulação dos dados e validações; 5 | * View: Exibição dos dados por meio de HTML ou XML; 6 | * Controller: Defini os controladores da página que será mostrado pelo usuário. 7 | 8 | ## MVP: 9 | * Model: Responsável pela leitura e escrita dos dados. Podemos realizarManipulação dos dados e validações; 10 | * View: Exibição dos dados por meio de HTML ou XML; 11 | * Presenter: Ela atua na View e no Model. 12 | 13 | ## MVVM: 14 | * Model: Responsável pela leitura e escrita dos dados. Podemos realizarManipulação dos dados e validações; 15 | * View: Exibição dos dados por meio de HTML ou XML; 16 | * ViewModel: Sua responsabilidade é disponibilizar para View uma lógica de apresentação 17 | 18 | # 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados 19 | 20 | ``` 21 | 22 | 23 | 24 | Exercício 25 | 26 | 27 | 30 | 31 |
32 | 33 | Seja bem vindo {{ nome }} 34 | 35 | 36 | 39 | 40 | 41 | ``` -------------------------------------------------------------------------------- /class-01/class-01-resolved-DevIgor-Igor-Oliveira.md: -------------------------------------------------------------------------------- 1 | Nome: Igor Oliveira 2 | 3 | 4 | Github: https://github.com/DevIgor 5 | 6 | 7 | Data: 10/06/2016 8 | 9 | 10 | 11 | # 1 - Explique qual é a definição de MVC, MVVM e MVP 12 | 13 | ## MVC: 14 | ### Model: 15 | Responsável pela leitura e escrita de dados e também pela validação dos mesmos 16 | ## View: 17 | Faz a exibição dos dados por meio de um arquivo HTML ou XML 18 | ### Controller: 19 | Recebe todas as requisições do usuário e ele vai controlar quais models e quais views serão mostradas para o usuário 20 | 21 | ## MVVM: 22 | ### Model: 23 | Encapsula a lógica de negócios e os dados 24 | ### View: 25 | Vai definir a aparência e/ou a estrutura que será exibida para o usuário. 26 | ### ViewModel: 27 | Sua responsabilidade é disponibilizar para View uma lógica de apresentação 28 | 29 | ## MVP: 30 | ### Model: 31 | Vai definir os dados que serão mostrados e/ou alternados pelo usuário 32 | ### View: 33 | Vai exibir os dados 34 | ### Presenter: 35 | Vai atuar sobre o viwe e o model 36 | 37 | 38 | # 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados 39 | 40 | Código no Codepen -> http://codepen.io/igor_oliveiraPS/pen/zBryZX 41 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-MagnumCortez-Magnum-Cortez.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 01 - Exercício 2 | **user:** [MagnumCortez](https://github.com/MagnumCortez) 3 | **autor:** Magnum cortez 4 | 5 | 6 | ## Explique qual a definição de MVC, MVVM e MVP. 7 | 8 | ### MVC - Model View Controller 9 | 10 | **MVC** é um padrão de arquitetura de software, na qual separa a aplicação em 3 camadas (Model, View e Controller). 11 | 12 | ### MVVM - Model View ViewModel 13 | 14 | MVVM se assemelha em alguns aspectos o MVC (Model View Controller) na qual permite ter uma visão clara da separação da Interface com o usuário( View ), sua lógica de apresentação ( ViewModel) e os seus Dados (Model). Com a separação de responsabilidades e desacoplamento conseguesse evoluir e manter melhor as aplicações. 15 | 16 | ## MVP - Model View Presenter 17 | 18 | **MVP** é uma derivação do MVC e também usado para construir principalmente interfaces gráficas. Em MVP a camada Presenter assume a função de mediadora (executada pelo Controller em MVC). 19 | 20 | 21 | ## Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, **formatados**. 22 | 23 | 24 | `arquivo.html` 25 | 26 | ``` 27 | 28 | 29 | 30 | 31 | Class 01 32 | 33 | 34 | 35 |
36 |
37 |
38 |
39 |
40 | 46 |

47 | 48 | Seu Nome é: {{Name}} {{LastName}}
49 | {{Name}} você está matriculado no curso de {{class}} 50 | 51 | 52 | 53 | 54 | 55 | ``` -------------------------------------------------------------------------------- /class-01/class-01-resolved-Ronaiza-Cardoso.md: -------------------------------------------------------------------------------- 1 | Nome: Ronaiza Cardoso 2 | 3 | 4 | Github: https://github.com/yesroh 5 | 6 | 7 | Data: 1467919037992 8 | 9 | 10 | 11 | # 1 - Explique qual é a definição de MVC, MVVM e MVP 12 | 13 | ## MVC: 14 | ### Model: 15 | Responsável pela leitura, escrita dos dados 16 | ## View: 17 | Responsável pela disponibilização dos dados para a visualização do usuário final 18 | ### Controller: 19 | Responsáel por receber requisições e processá-las enviando para as models e views responsáveis 20 | 21 | ## MVVM: 22 | ### Model: 23 | Modelo de domínio de uma aplicação carregando as classes de negócio que serão utilizadas em uma determinada aplicação 24 | ### View: 25 | Define o que será apresentado na tela 26 | ### ViewModel: 27 | Disponibiliza a lógica de apresentação para a view 28 | 29 | ## MVP: 30 | ### Model: 31 | Defini os dados a serem mostrados e/ou alterados pelo usuário 32 | ### View: 33 | Exibe os dados 34 | ### Presenter: 35 | Possui papel de mediador entre o M e o V 36 | 37 | 38 | # 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados 39 | 40 | ``` 41 | html 42 | 43 | 44 | 45 | 46 | Be Mean - Exercício Angular 47 | 48 | 49 | 50 |

Contato com o Usuário

51 |
52 | 53 | 54 | 55 | 56 |
57 | 58 |

{{name}}

59 |

Telefone: {{telephone}}. Email: {{email}}. Endereço: {{address}}.

60 | 61 | 62 | 66 | 67 | 68 | 69 | ``` -------------------------------------------------------------------------------- /class-01/class-01-resolved-amandavilela-AmandaVilela.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 01 - Exercício 2 | 3 | Nome: Amanda Vilela 4 | 5 | Github: amandavilela 6 | 7 | Data: 03/07/2016 - 17:18 8 | 9 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 10 | 11 | ### MVC (Model/View/Controller) 12 | 13 | #### Model 14 | 15 | Onde ficam os dados da aplicação, responsável pela leitura/escrita de dados e suas validações. 16 | 17 | #### View 18 | 19 | Onde os dados do Model são exibidos. 20 | 21 | #### Controller 22 | 23 | Recebe todas as requisições do usuário e manipula os dados que ficam no Model. 24 | 25 | ### MVVM (Model/View/ViewModel) 26 | 27 | #### Model 28 | 29 | Contém a lógica de negócios e os dados. 30 | 31 | #### View 32 | 33 | Define a aparência/estrutura exibida na tela. 34 | 35 | #### ViewModel 36 | 37 | Disponibiliza para a View uma lógica de apresentação. 38 | 39 | 40 | ### MVVM (Model/View/Presenter) 41 | 42 | #### Model 43 | 44 | Onde ficam os dados da aplicação, responsável pela leitura/escrita de dados e suas validações. 45 | 46 | #### View 47 | 48 | Onde os dados do Model são exibidos. 49 | 50 | #### Presenter 51 | 52 | Ligação entre View e Model, atualiza a View quando o Model é alterado e sincroniza o Model em relação à View. 53 | 54 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 55 | 56 | ``` 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | Dados 67 |

Nome: {{ nome }}

68 |

E-mail: {{ email }}

69 |

Telefone: {{ telefone }}

70 | ``` 71 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-cashnojohnny-Andre-Ferreira.md: -------------------------------------------------------------------------------- 1 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 2 | 3 | MVC: Model View Controller - Model é a camada de dados, Controller manipula os dados 4 | e a View apresenta os dados. 5 | MVVM: Model View ViewModel - ViewModel disponibiliza para a view uma lógica de 6 | apresentaçao. As camadas Model e View se comunicam através da camada 7 | ViewModel. ViewModel recebe notificaçao de eventos e realiza alguma açao. 8 | MVP: Model View Presenter - Presenter faz a comunicaçao entre Model e View 9 | 10 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | Ex 2 19 | 20 | 21 |
22 |
23 |
24 | 25 | 26 |
27 | 28 |
29 | 30 | 31 |
32 | 33 |
34 | 35 | 36 |
37 | 38 |
39 | 40 | 41 |
42 | 43 |
44 | 45 | 46 |
47 | 48 |
49 | 50 | 51 |
52 | 53 |
54 | 55 | 56 |
57 | 58 |
59 | 60 | 61 |
62 |
63 | 64 |
65 | {{name}}
66 | {{street}} {{streetNo}} {{complement}}
67 | {{neighbourhood}}
68 | {{postalCode}} {{city}} - {{state}}
69 | 70 |
71 | 72 | 75 | 76 | 77 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-davidwillian-DavidWillian.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 01 - Exercício 2 | 3 | Nome: David Willian 4 | 5 | Github: [davidwillianx](https://github.com/davidwillianx) 6 | 7 | Data: 24/07/2016 8 | 9 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 10 | 11 | ### MVC (Model/View/Controller) 12 | CONTROLLER: Responsável por receber requisicõe do usuário. 13 | MODEL: Responsável pelo négócio, onde nossa aplicação valida regras especificas do sistema, antes de um 14 | retorno para a requisição (VIEW). 15 | VIEW: Camada de apresentação, contém os dados que foram requistados no controller e validados no model processados 16 | em forma de apresentação (Página). 17 | 18 | 19 | 20 | ### MVVM (Model/View/ViewModel) 21 | No modelo MVVM a camada de apresentação não é renderizada de maneira estática, isso se deve a parte dos componentes que 22 | serão apresentados na view estarem ligados ao modelo, sendo assim, qualquer alteração no modelo é imediatamente refletida na View. 23 | O MODELO vai ser responsável pela lógica de negócio (semelhante ao MVC), seguido pela VIEW que define uma estrutura de apresentação, 24 | consumindo informações filtradas pelo MODEL. O diferencial VIEWMODEL tem como responsabilidade ser um intermédio entre as duas camadas citadas anteriormente, tendo 25 | como principal função é manter a view atualizada por qualquer alteração/interação feita que realize modificações no MODEL. 26 | 27 | 28 | ![mvvm lifecycle](https://i-msdn.sec.s-msft.com/dynimg/IC564167.png) 29 | 30 | 31 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 32 | 33 | ``` 34 | BEMEAN EXERCISE ONE 35 | 36 | 37 | 38 | 39 | 40 | Exercise One - BEMEAN (Its about time 4 me) 41 | 42 | 43 |
44 | 45 |
46 | Welcome Sr(a) {{ name }} 47 | 48 | 54 | 55 | ``` 56 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-gpanassol-Gabriel-Panassol-Fonseca.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 01 - Exercício 2 | 3 | Nome: Gabriel Panassol 4 | Github: https://github.com/gpanassol 5 | Data: 14/02/2017 - 23:29 6 | 7 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 8 | 9 | ### MVC 10 | 11 | O MVC é uma arquitetura de software muito utilizada para aplicação web. Ela é separa por três camadas, que por sinal é a sua sigla: 12 | 13 | #### M - Model 14 | Basicamente o modelo é onde eu tenho os dados. Ele é responsável pela leitura, escrita e validação desses dados. 15 | 16 | #### V - View 17 | Camada de visualização. Nela esta toda as 'telas' que interagem com o usuário. 18 | 19 | #### C - Controller 20 | Camada responsável por receber as requisições do usuário. 21 | 22 | ### MVVM 23 | 24 | O MVVM, visa estabelecer uma clara separação de responsabilidades em uma aplicação WPF e Silverlight, mantendo uma espécie de façade entre o Modelo de objetos e a View que é a interface, com a qual o usuário interage. 25 | 26 | ### MVP 27 | 28 | O MVP é uma evolução do MVC que se comunica bidirecionalmente com as outras camadas, evitando que o Model tenha que se comunicar diretamente com o View sem passar pelo Controller e este último é fundamental para a interação com o usuário. O MVP desacopla as funções e torna a arquitetura ainda mais modular. 29 | 30 | - A camada Presenter é ciente de tudo o que ocorre nas outras duas camadas e deixa-as cientes do que ela está fazendo 31 | - a interação com usuário é feita primariamente pelo View, e este pode delegar ao Presenter determinadas tarefas 32 | - há uma relação um-para-um entre estas camadas. Nesta relação há uma referência do View para o Presenter mas não o oposto. 33 | 34 | É possível vincular dados do View com o Model através de data binding. Isto ocorre na variação Supervising Controller, em oposição à variação Passive View onde a View essencialmente só possui o desenho da UI. 35 | 36 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 37 | 38 | ``` 39 | 40 | 41 | 42 | 43 | {{titulo}} 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 |
Seu Nome:
Profissão:
Responsabilidades:
61 | 62 | 63 |

Olá {{ nome }}, Bem Vindo!! 64 |
Sua função será {{ profissao }} nessa empresa e 65 |
suas responsabilidades serão {{responsabilidade}} 66 |

67 | 68 | 71 | 72 | 73 | ``` 74 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-gustavoprado013-gustavo-prado.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 01 - Exercício 2 | **user:** [gustavoprado013](https://github.com/gustavoprado013) 3 | **autor:** Gustavo Prado 4 | 5 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 6 | 7 | MVC: Model View Controller - Model é a camada de dados, Controller manipula os dados 8 | e a View apresenta os dados. 9 | 10 | MVVM: Model-View View-Model - ViewModel disponibiliza para a view uma lógica de 11 | apresentaçao. As camadas Model e View se comunicam através desta camada ($scope). 12 | 13 | MVP: Model View Presenter - O Presenter faz a comunicaçao entre Model e View. 14 | 15 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | Exercício 01 - AngularJS 24 | 25 | 34 | 35 | 38 | 39 | 40 |
41 |
42 |
43 | 44 | 45 |
46 | 47 |
48 | 49 | 50 |
51 | 52 |
53 | 54 | 55 |
56 | 57 |
58 | 59 | 60 |
61 |
62 | 63 | {{name}}
64 | {{postalCode}}- 65 | {{city}}- 66 | {{state}} 67 | 68 |
69 | 70 | 71 | 72 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-hc3-Eliel-das-Virgens.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 01 - Exercício 2 | **user:** [hc3](https://github.com/hc3) 3 | **autor:** Eliel das Virgens 4 | 5 | ## Explique qual a definição de MVC, MVVM e MVP. 6 | MVC = padrão amplamente conhecido como uma junção de varios design patterns OO , o significado de sua sigla é Model , View , Controller 7 | e ele defende a separaçao das responsabilidades onde model e view se comunicam através de um controller um padrão usado em varias linguagens... 8 | 9 | MVP = é uma evolução do o MVC que se comunica de forma bidirecional com as outras camadas, evitando que o model tenha que passar pelo controller 10 | para atualizar a view. 11 | 12 | MVVM = padrão criado por John Gossman, e promove a total separação, o model não conhece a view e vice e versa sendo que a conversa entre os dois 13 | é intermediada pelo view model é nesse momento que entra em cena o two way databinding. 14 | 15 | ## fiz uma pesquisa e o que consegui entender de cada um foi ## 16 | 17 | MVC = é uma padrão mais conhecido existem muitos artigos sobre ele, ele é um padrão de arquitetura que faz uso de muitos design patterns muito usando 18 | em linguagens como java , php , delphi, é um marco na arquitetura de software pois ele promove muita organização ao projeto. 19 | 20 | MVP = é uma evolução do MVC usando um tipo de listener ou observer como presenter para poder notificar a view de mudanças no model 21 | 22 | MVVM = é uma evolução que pode-se dizer uma versão final do MVP , nele é usando um view model que no caso particular do Angular acaba por torna-se des- 23 | necessário o uso do $scope ou this , deixando o código mais elegante e influênciando até no comportamento do código dos diferentes cenários. 24 | 25 | 26 | 27 | ## Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 28 | 29 | ```html 30 | 31 | 32 | 33 | 34 | aula01 35 | 36 | 37 | 38 | 39 | 40 | 41 |
42 |
43 | 46 |
47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 |
Nome
{{ nome }}
61 |
62 | 63 | 64 | 65 | 66 | 67 | 70 | 71 | 72 | 73 | ``` -------------------------------------------------------------------------------- /class-01/class-01-resolved-joseasousa-jose-alves.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 01 - Exercício 2 | **user:** [joseasousa](https://github.com/joseasousa/) 3 | **autor:** Jose Alves De Sousa Neto 4 | 5 | #### 1- Explique qual é a definição de MVC, MVVM,MVP 6 | 7 | ## Model 8 | ``` 9 | Model é onde ira ficar a representação dos objetos do banco 10 | ``` 11 | ## View 12 | 13 | ``` 14 | View são as telas onde ira ter a interação com o usuario 15 | ``` 16 | ## Controller 17 | 18 | ``` 19 | Controller é a "cola" entre as view e os models, é onde ira se implementar a parte lojica 20 | ``` 21 | 22 | ### MVC (Model/View/Controller) 23 | ``` 24 | MVC é o modelo de camadas de aplicação onde se divide em model, view e controller 25 | ``` 26 | 27 | 28 | ### MVVM (Model/View/ViewModel) 29 | ``` 30 | MVVM é o modelo de camadas onde se contacta uma view ela cham um model e retorna para outra view 31 | ``` 32 | 33 | ### MVP 34 | 35 | ``` 36 | é o modelo baseado em apresentação 37 | ``` 38 | 39 | 40 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 41 | 42 | ```html 43 |
44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 |
53 | 54 | 55 | 56 | Dados 57 |

Nome: {{ nome }}

58 |

E-mail: {{ email }}

59 |

Telefone: {{ telefone }}

60 |

Idade: {{ idade }}

61 | 62 | 63 | ``` 64 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-ronal2do-Ronaldo-Lima.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 01 - Exercício 2 | ** Nome:** Ronaldo Lima 3 | ** Github:** ronal2do 4 | ** Data:** 1463970721 5 | 6 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 7 | 8 | ### MVC: 9 | Model View Controller - Esse padrão divide seu sistema em 3 responsábilidades, **Model** - Define suas regras de negócio, **View** - A parte visual, renderizacão do html, **Controller** - Faz a comunicação entre elas manipulando os dados. 10 | 11 | ### MVVM: 12 | Model View ViewModel - **ViewModel** éa peça fundamental no MVVM, por que é ela quem vai coordenar as iterações da View com o Model, separando ambos para que não haja contato direto. Nele ocorre o 2-Way data Binding do NG. 13 | 14 | ### MVP: 15 | Model View Presenter - **Presenter** - É a ligação entre View e Modelcomo dos exemplos acima. Ele notifica e atualiza a view das alteracões feitas. 16 | 17 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 18 | 19 | `Framework css bulma.io` 20 | 21 | ```html 22 | 23 | 24 | 25 | 26 | 27 | 28 | Form 29 | 30 | 31 | 32 | 33 |
34 | 35 |

36 | 37 |

38 | 39 |

40 | 41 | 42 | 43 |

44 | 45 |

46 | 47 | 48 | 49 |

50 | 51 |

52 | 53 | 59 | 60 |

61 | 62 |

63 | 64 |

65 |

66 | 70 |

71 |

72 | 73 | 74 |

75 | 76 | 77 |
78 | {{name}}
79 | {{username}}
80 | {{email}}
81 | {{subject}}
82 | {{message}}
83 | {{terms}} 84 |
85 | 86 | 87 | 90 | 91 | 92 | ``` -------------------------------------------------------------------------------- /class-01/class-01-resolved-tiamatpontal-Carlos-Alberto-Araujo-Barreto.md: -------------------------------------------------------------------------------- 1 | # Angular - Exercício 01 - resolvido 2 | 3 | autor: Carlos Alberto de Araujo barreto 4 | 5 | 6 | ## Exercício 01 - Explique qual a definição de MVC, MVVM e MVP. 7 | 8 | MVC(model-view-controller) - é definido como um modelo de 3 camadas: model, view e controller. 9 | A camada model é responsável por toda definição dos padrões dos dados, a camada controller faz a comunicação entre a camada view e model, tanto na entrada dos dados à partir da camada view que é responsável pela exibição dos dados, como no retorno da camada model com as informações para a camada view. 10 | 11 | MVVM(model-view-viewmodel) - modelo que facilita a separação do desenvolvimento da interface gráfica das regras de negócio e back-end. 12 | A camada viewmodel é um conversor de valor, e é responsável por converter os objetos fornecidos pela camada model em um formato que pode ser gerenciado e apresentado de maneira simples. Esta é mais model que view, pois lida com a maior parte da lógica de exibição das informações. 13 | 14 | MVP(model-view-presenter) - é uma derivação do MVC e muito usado na construção de interfaces para o usuário. 15 | A camada presenter assume a funcionalidade de "middle-man" e toda a lógica de apresentação das informações ficam por sua conta. 16 | 17 | ## Exercício 02 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 28 |
29 | 32 |
33 | 34 | Olá, , você possui anos. 35 | 36 | 37 | 40 | 41 | -------------------------------------------------------------------------------- /class-01/class-01-resolved-valdir-pereira-Valdir-Pereira.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula01 - Exercício 2 | Nome: Valdir Pereira 3 | [Github profile ](https://github.com/valdir-pereira) 4 | 5 | Data: 09/08/2016 6 | 7 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 8 | 9 | ### MVC: Model/View/Controller 10 | 11 | #### Model 12 | Camada de dados, responsável pela leitura/escrita e suas validações 13 | 14 | #### View 15 | Aprenta os dados para o usuário. 16 | 17 | #### Controller 18 | Manipula os dados que vem das requisições do usuário. 19 | 20 | 21 | ### MVP: Model/View/Presenter 22 | 23 | #### Model 24 | É a interface que define os dados a serem exibidos. 25 | 26 | #### View 27 | Responsável pela aprentação dos dados do Model e os comandos dos usuários (events) 28 | 29 | #### Presenter 30 | Trabalha sobre o Model e a View. Ele recebe os dados do Model e trabalha para que eles sejam exibidos na view. 31 | 32 | 33 | ### MVVM: Model-View / ViewModel 34 | #### Model 35 | É onde fica a camada de negocios. 36 | 37 | #### View 38 | A view não tem nenhum conhecimento do model, a view é ativa e contem comportamentos, eventos e data binding. 39 | 40 | #### ViewModel 41 | É responsável por apresentar uma separação e exposição dos métodos e comandos para gerenciar o estado da view e manipular o model. 42 | 43 | 44 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 45 | 46 | ``` 47 | 48 | 49 | 50 | 51 | Exercise 01 52 | 53 | 54 | 55 | 56 |
57 |
58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 |

{{nome}}

70 |

{{pokemon}}

71 | 72 |
73 |
74 | 75 | 76 | 79 | 80 | 81 | 82 | ``` 83 | -------------------------------------------------------------------------------- /class-01/costaceta/css/style.css: -------------------------------------------------------------------------------- 1 | /*Reset*/ 2 | 3 | *{ 4 | margin: 0; 5 | padding: 0; 6 | } 7 | 8 | /*Font*/ 9 | 10 | @import url('https://fonts.googleapis.com/css?family=Reem+Kufi'); 11 | 12 | /*Geral*/ 13 | 14 | body{ 15 | background: #fafafa; 16 | font-family: 'Reem Kufi', sans-serif; 17 | } 18 | p{ 19 | text-align: left; 20 | margin-bottom: 5px; 21 | } 22 | 23 | /*Box*/ 24 | 25 | .box{ 26 | border: 1px solid #ececec; 27 | border-radius: 5px; 28 | box-sizing: border-box; 29 | background: #fff; 30 | margin: 2em auto; 31 | max-width: 400px; 32 | padding: 1.5em; 33 | width: 100%; 34 | } 35 | .box__title{ 36 | color: #666; 37 | margin-bottom: 15px; 38 | text-align: center; 39 | } 40 | .box__input{ 41 | border: 1px solid #ccc; 42 | border-radius: 5px; 43 | box-sizing: border-box; 44 | display: block; 45 | margin-bottom: 20px; 46 | padding: 1em; 47 | width: 100%; 48 | } 49 | -------------------------------------------------------------------------------- /class-01/costaceta/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Class 01 - Exercício 02 7 | 8 | 9 | 10 | 11 |
12 |

Mensagem ouvidoria

13 | 16 | 19 | 22 | 26 |
27 | 28 |
29 |

30 | Dados fornecidos: 31 |

32 |

Nome: {{ nome }}

33 |

E-mail: {{ email }}

34 |

Assunto: {{ assunto }}

35 |

Mensagem: {{ msn }}

36 |
37 | 38 | 39 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /class-01/gkal19/class-01-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 01 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 6 | 7 | Model View Controller. 8 | -`Model` é a camada de dados 9 | -`Controller` manipula 10 | -`View` apresenta os dados 11 | 12 | Model View ViewModel 13 | -`ViewModel` é aquela que disponibiliza para a `view` uma tal "lógica de apresentação" 14 | -`Model & View` se comunicam com a `ViewModel` ou atravé dela. 15 | -`ViewModel` recebe notificações e realiza alguma ação. 16 | 17 | Model View Presenter 18 | -`Presenter` faz a comunicaçao entre Model e View 19 | 20 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 21 | 22 | Observação: Arquivo `index` na pasta do exercício. -------------------------------------------------------------------------------- /class-01/gkal19/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | BeMEAN AngularJS 8 | 9 | 10 |
11 |
12 |
13 | 14 | 15 |
16 | 17 |
18 | 19 | 20 |
21 | 22 |
23 | 24 | 25 |
26 | 27 |
28 | 29 | 30 |
31 |
32 | 33 | 34 |

Nome: {{name}}

35 |

E-mail: {{email}}

36 |

Localização: {{city}}-{{state}}

37 |
38 | 39 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /class-01/nicors/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Class 01 - Exercício 02 7 | 8 | 9 | 10 |
11 |

Contato

12 |
13 | 16 | 19 | 23 |
24 |
25 | 26 |
27 |

Visualização

28 |

Nome: {{ nome }}

29 |

E-mail: {{ email }}

30 |

Mensagem: {{ msg }}

31 |
32 | 33 | 34 | 35 | 38 | 39 | -------------------------------------------------------------------------------- /class-01/paulinhoerry/class-01-resolved-paulinhoerry-Paulo-Rodrigues.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 01 - Exercício 2 | 3 | Nome: Paulo Rodrigues 4 | 5 | Github: [paulinhoerry](https://github.com/paulinhoerry) 6 | 7 | Data: 03/11/2016 8 | 9 | ## 1 - Explique qual é a definição de MVC, MVVM e MVP 10 | 11 | ### MVC (Model/View/Controller) 12 | 13 | #### Model 14 | 15 | Manipula os dados da aplicação. 16 | 17 | #### View 18 | 19 | Responsável pela interação com o usuário e exibição dos dados. 20 | 21 | #### Controller 22 | 23 | Receber os eventos disparado pelo usuário e manipula os dados que ficam no Model. 24 | 25 | ### MVVM (Model/View/ViewModel) 26 | 27 | #### Model 28 | 29 | Contém a lógica de negócios e os dados. 30 | 31 | #### View 32 | 33 | É o elemento visual. 34 | 35 | #### ViewModel 36 | 37 | Disponibiliza para a View uma lógica de apresentação. 38 | 39 | 40 | ### MVP (Model/View/Presenter) 41 | 42 | #### Model 43 | 44 | Onde ficam os dados da aplicação, responsável pela leitura/escrita de dados e suas validações. 45 | 46 | #### View 47 | 48 | Onde os dados do Model são exibidos. 49 | 50 | #### Presenter 51 | 52 | Ligação entre View e Model, atualiza a View quando o Model é alterado e sincroniza o Model em relação à View. 53 | 54 | ## 2 - Crie uma aplicação com um nome e um form onde os dados colocados neles sejam mostrados logo abaixo, formatados. 55 | 56 | ```html 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 |

Nome: {{ nome }}

67 |

E-mail: {{ email }}

68 |

Telefone: {{ telefone }}

69 | ``` 70 | -------------------------------------------------------------------------------- /class-01/tuchedsf/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Exercício 1 5 | 6 | 7 | 8 | 9 | 10 |
11 |
12 |

Cadastro time Coração

13 |
14 |
15 |
16 | Nome: 17 | 18 |
19 |
20 |
21 |
22 | Time Coração: 23 | 24 |
25 |
26 |
27 |
28 | Idade: 29 | 30 |
31 |
32 |
33 |
34 |
35 |

Resultado

36 |

Nome: {{name}}

37 |

Time: {{time}}

38 |

Idade: {{idade}}

39 |
40 |
41 | 44 | 45 | -------------------------------------------------------------------------------- /class-01/willianlauber/class-01-resolved-Willian-Lauber.md: -------------------------------------------------------------------------------- 1 | *user:** [willianlauber](https://github.com/willianlauber) 2 | **autor:** Willian Lauber 3 | **data:** 1475176591 4 | Data: 29/9/2016 5 | 6 | # 1 - Explique qual é a definição de MVC, MVVM e MVP 7 | 8 | ## MVC: 9 | ### Model: 10 | É a camada onde estão os artefatos responsáveis pela leitura/escrita dos dado bem como sua validação. 11 | ### View: 12 | Define a aparência da interface e sua estrutura, estando diretamente em contato com o usuário. 13 | ### Controller: 14 | Responsável pelo controle das models, requisições e views. 15 | 16 | ## MVVM: 17 | ### Model: 18 | Responsavel pela lógica de negócios e pelos modelos de dados. 19 | ### View: 20 | Define a aparência da interface e sua estrutura, estando diretamente em contato com o usuário. 21 | ### ViewModel: 22 | É a cola entre a view e model oferece à view uma lógica de apresentação. 23 | 24 | ## MVP: 25 | ### Model: 26 | Responsável pela lógica de negócios e pelos modelos de dados. 27 | ### View: 28 | Define a aparência da interface e sua estrutura, estando diretamente em contato com o usuário. 29 | ### Presenter: 30 | É a cola entre a view e model, fomentando o denominado "data binding". 31 | 32 | -------------------------------------------------------------------------------------------------------------------- 33 | # 2 - Crie uma aplicação com um nome e um formulário onde os dados colocados nele sejam mostrados logo abaixo, formatados. 34 | 35 | 36 | ```html 37 | 38 | 39 | 40 | 41 | 42 | 43 | {{title}} 44 | 56 | 57 | 58 | 59 | 60 |
61 |
62 | 63 |
64 | 65 |
66 | 67 |
68 | 69 |
70 |
71 |
72 | 73 |

Olá {{nome}} {{sobrenome}} como é morar no/a {{pais}}

74 | 75 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /class-01/willianlauber/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | {{title}} 8 | 19 | 20 | 21 | 22 |
23 |
24 | 25 |
26 | 27 |
28 | 29 |
30 | 31 |
32 |
33 |
34 |

Olá {{nome}} {{sobrenome}} como é morar no/a {{pais}}

35 | 36 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /class-02/.ignore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-02/.ignore -------------------------------------------------------------------------------- /class-02/class-02-resolved-AlexMCoder-Alex-Morgado-Pereira.md: -------------------------------------------------------------------------------- 1 | # 1) Crie 1 exemplo para pelo menos 5 filtros padrões do Angular 2 | 3 | ``` 4 | 5 | 6 | 7 | Angular 8 | 9 | 10 | Filter Uppercase: {{ nome | uppercase }}
11 | Filter lowercase: {{ nome | lowercase }}
12 | Filter limitTo: {{ nome | limitTo:3 }}
13 | 14 | Filter Currency: {{ number | currency }}
15 | 16 | Filter Date: {{ data | date }}
17 | 18 | 19 |
20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 | 32 | 33 | 34 | ``` 35 | 36 | # 2) Crie 1 filtro novo onde você passe em um input a sua idade e ele diga se você é maior ou menor que 18 anos. 37 | 38 | ``` 39 | 40 | 41 | 42 | Angular 43 | 44 | 45 | Você é: {{ idade | isAdult }}
46 | 47 | 48 |
49 | 50 | 51 | 52 | 68 | 69 | 70 | ``` 71 | 72 | # 3) Crie 1 filtro que receba um horário, entre 0:00 e 23:59, e diga: 73 | * Bom dia. // até 12:00 74 | * Boa tarde. // até 18:00 75 | * Boa noite. 76 | 77 | ``` 78 | 79 | 80 | 81 | Angular 82 | 83 | 84 | Você é: {{ time | isTime }}
85 | 86 | 87 |
88 | 89 | 90 | 91 | 108 | 109 | 110 | ``` 111 | -------------------------------------------------------------------------------- /class-02/class-02-resolved-amandavilela-AmandaVilela.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 02 - Exercício 2 | 3 | Nome: Amanda Vilela 4 | 5 | Github: amandavilela 6 | 7 | Data: 03/07/2016 - 17:18 8 | 9 | ## 1 - Crie 1 exemplo para pelo menos 5 filtros padrões do Angular. 10 | 11 | ``` 12 | 13 | {{ currency | currency }} 14 |
15 | 16 | {{ name | uppercase }} 17 |
18 | 19 | {{ name2 | lowercase }} 20 |
21 | 22 | {{ decimal | number:2 }} 23 |
24 | 25 | {{ limit | limitTo:10 }} 26 | ``` 27 | 28 | ## 2 - Crie 1 filtro novo onde você passe em um input a sua idade e ele diga se você é maior ou menos que 18 anos. 29 | 30 | ``` 31 | angular.module("myApp", []) 32 | .filter("maioridade", function() { 33 | return function (age) { 34 | if (age) { 35 | if (age >= 18) return "maior de idade"; 36 | if (age < 18 ) return "menor de idade"; 37 | else return "idade inválida"; 38 | } 39 | } 40 | }); 41 | ``` 42 | 43 | ## 3 - Crie um filtro que receba um horário, entre 0:00 e 23:59, e diga: 44 | - Bom dia. // até 12:00 45 | - Boa tarde. // até 16:00. 46 | - Boa noite. 47 | 48 | ``` 49 | angular.module("myApp", []) 50 | .filter("mensagem", function() { 51 | return function (time) { 52 | if (time) { 53 | var hours = parseInt(time.substring(0, 2), 10); 54 | if(hours >= 0 && hours < 12) msg = 'Bom dia'; 55 | if(hours >= 12 && hours < 18) msg = 'Boa tarde'; 56 | if(hours >= 18 && hours < 23) msg = 'Boa noite'; 57 | return msg; 58 | } 59 | } 60 | }); 61 | ``` 62 | -------------------------------------------------------------------------------- /class-02/class-02-resolved-cashnojohnny-Andre-Ferreira.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Ex 2 8 | 9 | 10 |
11 |

Exercício 1

12 | 13 | 14 | {{currencyValue | currency}} 15 |
16 | 17 | 18 | 19 | {{decimalValue | number:3}} 20 |
21 | 22 | 23 | 24 | {{dateValue | date:"fullDate"}} 25 |
26 | 27 | 28 | 29 | {{limitToValue | limitTo:5}} 30 |
31 | 32 | 33 | 34 | {{orderByValue | orderBy}} 35 |
36 | 37 |

Exercício 2

38 | 39 | 40 | {{age | checkAge}} 41 |
42 | 43 |

Exercício 3

44 | 45 | 46 | {{hour | greet}} 47 |
48 |
49 | 50 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /class-02/class-02-resolved-joseasousa-jose-alves.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 02 - Exercício 2 | **user:** [joseasousa](https://github.com/joseasousa/) 3 | **autor:** Jose Alves De Sousa Neto 4 | 5 | ## 1 - Crie 1 exemplo para pelo menos 5 filtros padrões do Angular. 6 | 7 | ```html 8 | 9 | 10 |
{{numero| number:2}} 11 |
12 |
13 | 14 |
{{abc| limitTo:3}} 15 |
16 |
17 | 18 |
{{data| date:'dd-MM-yy'}} 19 |
20 |
21 | 22 |
{{maiusculo| uppercase}} 23 |
24 |
25 | 26 |
{{grana| currency}} 27 | 28 | ``` 29 | 30 | ## Crie 1 filtro novo onde você passe em um input a sua idade e ele diga se você é maior que 18 anos. 31 | 32 | 33 | ```html 34 | {{texto | demaior }} 37 | 38 | 49 | ``` 50 | 51 | ## Crie 1 filtro que receba um horário e entre as 0:00 e 23:59 e diga 52 | ##Bom dia // até 12:00 53 | ##Boa tarde // até 18:00 54 | ##Boa noite 55 | 56 | 57 | ```html 58 | {{texto | comprimento }} 61 | 62 | 80 | ``` -------------------------------------------------------------------------------- /class-02/gkal19/class-02-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 02 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | **Data:** 1463600124 6 | 7 | ## 1 - Crie 1 exemplo para pelo menos 5 filtros padrões do Angular. 8 | 9 | [Arquivo](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-02/gkal19/index1.html) `index1.html` 10 | 11 | ## 2 - Crie 1 filtro novo onde você passe em um input a sua idade e ele diga se você é maior que 18 anos. 12 | 13 | [Arquivo](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-02/gkal19/index2.html) `index2.html` 14 | 15 | ## 2 - Crie 1 filtro que receba um horário e entre as 0:00 e 23:59 diga 16 | 17 | [Arquivo](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-02/gkal19/index3.html) `index3.html` 18 | -------------------------------------------------------------------------------- /class-02/gkal19/index1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Filtros 5 | 6 | 7 | 8 |
9 | 10 |
11 | 14 | 17 | 20 | 23 | 26 | 29 |
30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 |
NomeSobrenomeNascimentoCidadeEstadoDoar valor:
{{ nome | lowercase }}{{ sobrenome | uppercase }}{{ nascimento | date:'dd-MM-yyyy' }}{{ city | limitTo:11 }}{{ state | limitTo:2 }}{{ doar | number}}
54 |
55 | 56 | 57 | 58 | 61 | 62 | 63 | -------------------------------------------------------------------------------- /class-02/gkal19/index2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Filtros 5 | 6 | 7 | 8 |
9 |
10 | 13 |
14 | Olá {{age | calcular}} 15 |
16 | 17 | 18 | 19 | 28 | 29 | -------------------------------------------------------------------------------- /class-02/gkal19/index3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Filtros 5 | 6 | 7 | 8 | 9 |
10 | 11 |
12 | Que horas são e qual seu nome? 13 |
14 | 15 | 16 |
17 | 18 | 21 |
22 | {{hour | calcular}} 23 |
24 | 25 | 26 | 39 | 40 | -------------------------------------------------------------------------------- /class-02/nicors/class-02-resolved-nicors-Nicolas-Rafael-Serrato.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 02 - Exercício 1, 2 e 3 2 | **Autor:** Nicolas Serrato 3 | **User:** [nicors](https://github.com/nicors) 4 | **Data:** 1498663550986 5 | 6 | **Obs**: Arquivo *index.html* possui exemplo em funcionamento 7 | 8 | ## 1 - Crie 1 exemplo para pelo menos 5 filtros padrões do Angular 9 | 10 | ```html 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | Nome completo: {{nomeCompleto | uppercase}} 20 | Nome de usuario: {{nomeUsuario | lowercase}} 21 | Conta: {{conta | limitTo:6}} 22 | Valor transferência: {{valor | number:2 | currency:"R$"}} 23 | ``` 24 | 25 | ## 2 - Crie 1 filtro novo onde você passe em um input a sua idade e ele diga se você é maior ou menor que 18 anos. 26 | 27 | ```js 28 | angular.module('class02', []) 29 | .filter("idade", function() { 30 | return function (age) { 31 | if (age) { 32 | if (age >= 18) return age + " - Usuário maior de idade, transferência aprovada"; 33 | if (age < 18 ) return age + " - Usuário menor de idade, transferência pendente"; 34 | else return "idade inválida"; 35 | } 36 | } 37 | }) 38 | ``` 39 | 40 | ## 3 - Crie 1 filtro que receba um horário, entre 0:00 e 23:59, e diga: 41 | ## Bom dia. // até 12:00 42 | ## Boa tarde. // até 18:00 43 | ## Boa noite. 44 | 45 | ```js 46 | .filter("saudacao", function() { 47 | return function(text) 48 | { 49 | var hora = text.getHours(); 50 | if(hora >= 0 && hora <= 12) 51 | return "Bom dia."; 52 | else if(hora >= 12 && hora <= 18) 53 | return "Boa tarde."; 54 | else if(hora >= 18 && hora <= 23) 55 | return "Boa noite."; 56 | } 57 | }) 58 | ``` 59 | -------------------------------------------------------------------------------- /class-02/nicors/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Class 02 7 | 8 | 9 | 10 | 11 |
12 |
13 |
14 |

Transferência

15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 |
32 |
33 |
34 |

Comprovante

35 |

{{hora | saudacao}}

36 |

Nome completo: {{nomeCompleto | uppercase}}

37 |

Nome de usuario: {{nomeUsuario | lowercase}}

38 |

E-mail: {{email}}

39 |

Idade: {{idade | idade}}

40 |

Conta: {{conta | limitTo:6}}

41 |

Valor transferência: {{valor | number:2 | currency:"R$"}}

42 | 43 |
44 |
45 |
46 | 47 | 48 | 72 | 73 | -------------------------------------------------------------------------------- /class-02/paulinhoerry/class-02-resolved-paulinhoerry-Paulo-Rodrigues.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 02 - Exercício 2 | 3 | Nome: Paulo Rodrigues 4 | 5 | Github: [paulinhoerry](https://github.com/paulinhoerry) 6 | 7 | Data: 03/11/2016 8 | 9 | ## 1 - Crie 1 exemplo para pelo menos 5 filtros padrões do Angular. 10 | 11 | ```html 12 | 15 | 18 | 21 | 24 | ``` 25 | 26 | 27 | ## 2 - Crie 1 filtro novo onde você passe em um input a sua idade e ele diga se você é maior ou menos que 18 anos. 28 | 29 | ```html 30 | 33 | ``` 34 | 35 | ```js 36 | angular 37 | .module('study', []) 38 | .filter('DateFilter', DateFilter) 39 | 40 | function DateFilter() { 41 | return function(age) { 42 | if(age >= 18) document.getElementById('result').innerHTML = 'Você é maior de idade'; 43 | else document.getElementById('result').innerHTML = 'Você é menor de idade'; 44 | } 45 | } 46 | ``` 47 | 48 | 49 | ## 3 - Crie um filtro que receba um horário, entre 0:00 e 23:59, e diga: 50 | - Bom dia. // até 12:00 51 | - Boa tarde. // até 16:00. 52 | - Boa noite. 53 | 54 | ```html 55 | 58 | ``` 59 | 60 | ```js 61 | angular 62 | .module('study', []) 63 | .filter('HourFilter', HourFilter) 64 | 65 | function HourFilter() { 66 | return function(time) { 67 | if(time) { 68 | var hour = time.getHours(); 69 | if(hour > 0 && hour < 12) document.getElementById('resultHour').innerHTML = 'Bom dia'; 70 | else if(hour < 18) document.getElementById('resultHour').innerHTML = 'Boa Tarde'; 71 | else document.getElementById('resultHour').innerHTML = 'Boa noite'; 72 | } 73 | } 74 | ``` 75 | -------------------------------------------------------------------------------- /class-02/willianlauber/class-02-resolved-willianlauber-Willian-Lauber.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 02 - Exercício 2 | **user:** [willianlauber](https://github.com/willianlauber) 3 | **autor:** Willian Lauber 4 | **Data:** 1475239287 5 | 6 | ## 1 - Crie um exemplo para, pelo menos, cinco filtros padrões do Angular. 7 | 8 | [ex1](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-02/willianlauber/ex1.html) 9 | 10 | ## 2 - Crie um filtro novo onde você passe em um input a sua idade, diga se você é maior ou menor que 18 anos. 11 | 12 | [ex2](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-02/willianlauber/ex2.html) 13 | 14 | ## 2 - Crie um filtro que receba um horário entre as 0:00 e 23:59 e diga: 15 | ###Bom dia. Até 12:00 16 | ###Boa tarde. Até 18:00 17 | ###Boa noite. 18 | [ex3](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-02/willianlauber/ex3.html) 19 | -------------------------------------------------------------------------------- /class-02/willianlauber/ex1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | aula2 - filtros 6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 |

Filtro moeda {{moeda | currency:"R$"}};

14 |

Filtro data {{data | date | uppercase }};

15 |

Filtro data com parâmetro {{data | date:'medium'}}

16 |

Nome: {{name | uppercase}}

17 |

Mensagem: {{details| limitTo:10}}

18 |
19 | 20 |
21 | 22 |
23 | 24 |
25 | 28 | 29 | 30 | 33 |
34 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /class-02/willianlauber/ex2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | aula2 - filtros 6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | {{idade | maioridade}} 16 |
17 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /class-02/willianlauber/ex3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | aula2 - filtros 6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | {{hour | saudar}} 16 |
17 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /class-03/class-03-resolved-AlexMCoder-Alex-Morgado-Pereira.md: -------------------------------------------------------------------------------- 1 | # Angularjs 1 - Aula 03 - Exercício 2 | 3 | User: [alexmcoder](https://github.com/AlexMCoder) 4 | 5 | Autor: Alex Morgado Pereira 6 | 7 | ## 1. Criar 1 Controller de Professores, igual aos outros, seguindo nosso último padrão. 8 | 9 | ``` 10 | 11 | 12 | 13 | 14 | Aula 3 15 | 16 | 17 | 18 |

Professores

19 | 24 | 25 | 26 | 27 | 40 | 41 | 42 | ``` 43 | 44 | ## 2. Utilizar seu filtro criado na aula passada em alguns dos seus valores. 45 | 46 | ``` 47 | 48 | 49 | 50 | 51 | Aula 3 52 | 53 | 54 | 55 |

Professores

56 | 61 | 62 | 63 | 64 | 88 | 89 | 90 | ``` 91 | -------------------------------------------------------------------------------- /class-03/class-03-resolved-Ronaiza-Cardoso.md: -------------------------------------------------------------------------------- 1 | # Angularjs 1 - Aula 03 - Exercício 2 | 3 | User: [yesroh](https://github.com/yesroh) 4 | 5 | Autor: Ronaiza Cardoso 6 | 7 | Data: 1467985026193 8 | 9 | ## 1. Criar 1 Controller de Professores, igual aos outros, seguindo nosso último padrão. 10 | 11 | ```html 12 | 13 | 14 | 15 | 16 | Be Mean - Aula 3 17 | 18 | 19 | 20 |

Professores

21 | 26 | 27 | 28 | 43 | 44 | 45 | ``` 46 | 47 | ## 2. Utilizar seu filtro criado na aula passada em alguns dos seus valores. 48 | 49 | ```html 50 | 51 | 52 | 53 | 54 | Be Mean - Aula 3 55 | 56 | 57 | 58 |

Teachers

59 | 64 | 65 | 66 | 91 | 92 | 93 | ``` 94 | -------------------------------------------------------------------------------- /class-03/class-03-resolved-amandavilela-AmandaVilela.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 03 - Exercício 2 | 3 | Nome: Amanda Vilela 4 | 5 | Github: amandavilela 6 | 7 | Data: 03/07/2016 - 17:18 8 | 9 | ## Criar 1 controller de professores, igual aos outros , seguindo nosso último padrão 10 | ## Utilizar seu filtro criado na aula passada em algum dos seus valores. 11 | 12 | ``` 13 | 14 | 15 | 16 | 17 | Exercicio 3 18 | 19 | 20 |
21 |

{{ User.titulo }}

22 | 27 |
28 |

{{ Curso.titulo }}

29 | 34 |
35 |
36 |

{{ Professor.titulo }}

37 | 42 |
43 |
44 | 45 | 90 | 91 | 92 | ``` 93 | -------------------------------------------------------------------------------- /class-03/class-03-resolved-cerezini-Mateus-Cerezini-Gomes.md: -------------------------------------------------------------------------------- 1 | # Angularjs 1 - Aula 03 - Exercício 2 | 3 | User: [Cerezini](https://github.com/cerezini) 4 | 5 | Autor: Mateus Cerezini Gomes 6 | 7 | Data: 1464056564542 8 | 9 | ## 1. Criar 1 Controller de Professores, igual aos outros, seguindo nosso último padrão. 10 | 11 | ```html 12 | 13 | 14 | 15 | 16 | Be Mean 17 | 18 | 19 | 20 |

Teachers

21 | 26 | 27 | 28 | 43 | 44 | 45 | ``` 46 | 47 | ## 2. Utilizar seu filtro criado na aula passada em alguns dos seus valores. 48 | 49 | ```html 50 | 51 | 52 | 53 | 54 | Be Mean 55 | 56 | 57 | 58 |

Teachers

59 | 64 | 65 | 66 | 91 | 92 | 93 | ``` 94 | -------------------------------------------------------------------------------- /class-03/class-03-resolved-tiamatpontal-CarlosAlbertoAraujoBarreto.md: -------------------------------------------------------------------------------- 1 | # Angular - Exercício 03 - resolvido 2 | 3 | autor: Carlos Alberto de Araujo barreto 4 | 5 | 6 | ## Exercício 01 - Criar um Controller de Professores, igual aos outros, seguindo nosso último padrão. 7 | ``` 8 | 9 | 10 | 11 | 12 | Exercicio 01 13 | 14 | 15 |

{{ Professores.titulo}}

16 | 19 | 20 | 33 | 34 | 35 | ``` 36 | ## Exercício 02 - Utilizar seu filtro criado na aula passada em alguns dos seus valores. 37 | ``` 38 | 39 | 40 | 41 | 42 | Exercicio 02 43 | 44 | 45 |

{{ Professores.titulo}}

46 | 49 | 50 | 73 | 74 | 75 | ``` -------------------------------------------------------------------------------- /class-03/gkal19/class-03-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 03 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | **Data:** 1463605343 6 | 7 | ## Criar 1 controller de professores, igual aos outros , seguindo nosso último padrão 8 | 9 | ```js 10 | function ProfessorController() { 11 | var vm = this; 12 | vm.titulo = "Webschool - Professores"; 13 | vm.professores = [ 14 | {name: 'Jean Carlo Nascimento', age:30} 15 | , {name: 'Vagner Kaefer', age:30} 16 | , {name: 'Anderson Faro', age:30} 17 | ]; 18 | } 19 | ``` 20 | 21 | ## Utilizar seu filtro criado na aula passada em algum dos seus valores. 22 | 23 | [Arquivo](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-03/gkal19/index.html) `index.html` aqui. -------------------------------------------------------------------------------- /class-03/gkal19/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | BeMEAN 7 | 8 | 9 |
10 |

{{ User.titulo }}

11 | 16 |
17 |
18 |

{{ Curso.titulo }}

19 | 24 |
25 | 26 |
27 |

{{ Professor.titulo }}

28 | 33 |
34 | 35 | 36 | 72 | 73 | -------------------------------------------------------------------------------- /class-03/nicors/class-03-resolved-nicors-Nicolas-Rafael-Serrato.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 03 - Exercício 2 | **user:** [nicors](https://github.com/nicors) 3 | **autor:** Nicolas Serrato 4 | 5 | **Data:** 1498823328353 6 | 7 | ## 1- Criar 1 controller de professores, igual aos outros , seguindo nosso último padrão 8 | 9 | 10 | ```js 11 | .controller('ProfessorController', ProfessorController); 12 | function ProfessorController() { 13 | var vm = this; 14 | vm.tirulo = "Be MEAN - Professores"; 15 | vm.professores = [ 16 | {name: 'Jean Carlo Nascimento', age: 30} 17 | , {name: 'Amanda Vilela', age:23} 18 | , {name: 'Itacir Ferreira Pompeu', age: 30} 19 | ]; 20 | } 21 | ``` 22 | 23 | ## 2- Utilizar seu filtro criado na aula passada em algum dos seus valores. 24 | 25 | [Arquivo](index.html) `index.html` exemplo funcional. 26 | -------------------------------------------------------------------------------- /class-03/nicors/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Class 03 - Controller 6 | 7 | 8 | 9 |

{{ User.titulo }}

10 | 15 | 16 |
17 |

{{ Curso.titulo }}

18 | 23 |
24 |
25 |

{{ Professor.titulo }}

26 | 31 |
32 | 33 | 34 | 35 | 77 | 78 | -------------------------------------------------------------------------------- /class-03/paulinhoerry/class-03-resolved-paulinhoerry-Paulo-Rodrigues.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 03 - Exercício 2 | 3 | Nome: Paulo Rodrigues 4 | 5 | Github: [paulinhoerry](https://github.com/paulinhoerry) 6 | 7 | Data: 03/11/2016 8 | 9 | ## 1- Criar 1 controller de professores, igual aos outros , seguindo nosso último padrão 10 | 11 | ```html 12 | 15 | ``` 16 | 17 | ```js 18 | angular 19 | .module('study', []) 20 | .controller('TeachersController', TeachersController); 21 | 22 | function TeachersController() { 23 | var vm = this; 24 | 25 | vm.teachersList = [ 26 | {name: "Brian Cox", class: "Physic"} 27 | ,{name: "Girafales", class: "Math"} 28 | ,{name: "Walter White", class: "Chemistry"} 29 | ] 30 | }; 31 | ``` 32 | 33 | 34 | ## 2 - Utilizar seu filtro criado na aula passada em algum dos seus valores. 35 | 36 | ```html 37 | 40 | ``` 41 | 42 | ```js 43 | angular 44 | .module('study', []) 45 | .filter('ClassFilter', ClassFilter) 46 | .controller('TeachersController', TeachersController); 47 | 48 | function ClassFilter() { 49 | return function(classType) { 50 | var div = document.createElement('div'); 51 | if (classType) { 52 | if (classType === 1) div.innerHTML = "Exatas"; 53 | if (classType === 2) div.innerHTML = "Humanas"; 54 | 55 | return div.innerText; 56 | } 57 | } 58 | } 59 | 60 | function TeachersController() { 61 | var vm = this; 62 | 63 | vm.teachersList = [ 64 | {name: "Brian Cox", class: "Physic", type: 1} 65 | ,{name: "Girafales", class: "Math", type: 1} 66 | ,{name: "Walter White", class: "Chemistry", type: 2} 67 | ] 68 | }; 69 | ``` 70 | -------------------------------------------------------------------------------- /class-03/willianlauber/class-03-resolved-willianlauber-Willian-Lauber.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 03 - Exercício 2 | **user:** [willianlauber](https://github.com/willianlauber) 3 | **autor:** Willian Lauber 4 | **data:** 1475258784 5 | 6 | 7 | ##1 Criar 1 controller de professores, igual aos outros, seguindo nosso último padrão. 8 | 9 | ##2 Utilizar um filtro, criado na aula passada, em algum dos seus valores. 10 | 11 | ```html 12 | 13 | 14 | 15 | 16 | aula3 - controllers 17 | 18 | 19 | 20 | 21 | 28 | 29 | 30 | 31 | {{frase | filtro}} 32 |
33 | 38 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /class-03/willianlauber/ex1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | aula3 - controllers 6 | 7 | 8 | 9 | 10 | 17 | 18 | 19 | 20 | {{frase | filtro}} 21 |
22 | 27 | 67 | 68 | -------------------------------------------------------------------------------- /class-04/class-04-resolved-MagnumCortez-Magnum-Cortez.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 04 - Exercício 2 | **user:** [MagnumCortez](https://github.com/MagnumCortez) 3 | **autor:** Magnum cortez 4 | 5 | ## 1- Adicionar mais 1 campo em todos os Controllers e utlizar ele em orderBy. 6 | 7 | ## 2- Utilizar esse valor adicional no ng-init para cada ng-repeat da View. 8 | 9 | ## 3- Criar um filtro para cada ng-repeat. 10 | 11 | ```html 12 | 13 | 14 | 15 | 16 | Class 03 17 | 18 | 19 |

{{User.titulo}}

20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 |
{{key}}
{{value}}
35 | 36 | 37 |
38 |

{{Teacher.titulo}}

39 | 40 | 41 | 46 |
47 | 48 | 49 | 78 | 79 | 80 | ``` -------------------------------------------------------------------------------- /class-04/gkal19/class-04-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 04 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | **Data:** 1463610515 6 | 7 | ## Adicionar mais 1 campo em todos os controllers e utilizar ele em orderBy 8 | 9 | Em `UserController` foi adicionado o campo `Username`. 10 | 11 | Em `CursoController` foi adicionado o campo `Nota`. 12 | 13 | Em `ProfessorController` foi adicionado o campo `Palestrante`. 14 | 15 | ## Utilizar esse valor adicional no ng-init para cada ng-repeat da view 16 | 17 | ```html 18 | UserController 19 | CursoController 20 | ProfessorController 21 | 22 | ``` 23 | 24 | ## Criar um campo de filtro para cada ng-repeat 25 | 26 | ```html 27 | 28 | 29 | ``` 30 | 31 | ```html 32 | 33 | 34 | ``` 35 | 36 | ```html 37 | 38 | 39 | ``` 40 | 41 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-04/gkal19/index.html) -------------------------------------------------------------------------------- /class-04/hc3/class-04-resolved-hc3-Eliel-das-Virgens.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 04 - Exercício 2 | **user:** [hc3](https://github.com/hc3) 3 | **autor:** Eliel das Virgens 4 | **date:** 13/05/2016 5 | 6 | ## Adicionar masi 1 campo em todos os controllers e utilizar ele em orderBy 7 | - campos adicionados foram 8 | - User - nivel_acesso 9 | - Curso - qnt_aulas 10 | - Professor - idade 11 | 12 | 13 | ## Utilizar esse valor adicional no ng-init para cada ng-repeat da view 14 | 15 | ```html 16 | 17 | 18 | 19 | ``` 20 | 21 | ## Criar um campo de filtro para cada ng-repeat, 22 | ```html 23 | 24 | 25 | 26 | 27 | 28 | 29 | ``` -------------------------------------------------------------------------------- /class-04/nicors/class-04-resolved-nicors-Nicolas-Rafael-Serrato.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 04 - Exercício 2 | **user:** [nicors](https://github.com/nicors) 3 | **autor:** Nicolas Serrato 4 | **Data:** 1499255973595 5 | 6 | ## 1- Adicionar mais 1 campo em todos os Controllers e utilizar ele em orderBy. 7 | 8 | *Adicionado campo id aos Controllers* 9 | 10 | ```js 11 | function UserController() { 12 | var vm = this; 13 | vm.titulo = "Be MEAN - Usuários"; 14 | vm.users = [ 15 | {name: 'Suissa', email: 'suissera@manoveio.com', id:1} 16 | , {name: 'Nicolas', email: 'nicolas.serrato@outlook.com', id: 2} 17 | , {name: 'Carlos', email: 'carlos.gabriel@outlook.com', id: 3} 18 | ]; 19 | } 20 | function CursoController() { 21 | var vm = this; 22 | vm.titulo = "Be MEAN - Cursos"; 23 | vm.cursos = [ 24 | {name: 'Be MEAN', teacher: 'Suissa', id: 1} 25 | , {name: 'Learning Machine', teacher: 'Ivan Gustavo', id: 2} 26 | , {name: 'Laravel', teacher: 'Michael Douglas', id: 3} 27 | ]; 28 | } 29 | function ProfessorController() { 30 | var vm = this; 31 | vm.titulo = "Be MEAN - Professores"; 32 | vm.professores = [ 33 | {name: 'Jean Carlo Nascimento', age: 30, id: 1} 34 | , {name: 'Amanda Vilela', age:23, id: 2} 35 | , {name: 'Itacir Ferreira Pompeu', age: 30, id: 3} 36 | ]; 37 | } 38 | ``` 39 | 40 | ## 2- Utilizar esse valor adicional no ng-init para cada ng-repeat da View. 41 | 42 | 43 | 44 | 45 | ## 3- Criar um campo de filtro para cada ng-repeat. 46 | 47 | ```html 48 | 49 | 50 | 51 | {{ value }} 52 | 53 | 54 | 55 | 56 | {{value}} 57 | 58 | 59 | 60 | 61 | {{value}} 62 | 63 | ``` 64 | 65 | [Arquivo](index.html) `index.html` exemplo funcional. 66 | -------------------------------------------------------------------------------- /class-05/class-05-resolved-amandavilela-AmandaVilela.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 05 - Exercício 2 | 3 | Nome: Amanda Vilela 4 | 5 | Github: amandavilela 6 | 7 | Data: 03/07/2016 - 18:42 8 | 9 | ## Criar uma função para ordenar uma tabela a partir de uma coluna clicando em sua th>td ordenando pelo campo da coluna 10 | 11 | ``` 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 |
{{ key }}
{{ value }}
24 | 25 | function order(key) { 26 | vm.predicate = key; 27 | vm.reverse = !vm.reverse; 28 | } 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 |
{{ key }}
{{ value }}
42 | 43 | function order(key) { 44 | vm.predicate = key; 45 | vm.reverse = !vm.reverse; 46 | } 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 |
{{ key }}
{{ value }}
60 | 61 | function order(key) { 62 | vm.predicate = key; 63 | vm.reverse = !vm.reverse; 64 | } 65 | ``` 66 | 67 | ## Criar mais 1 Controller para Teachers com seu form para adição, listagem (defina um Array inicial) com a ordenação do exercício anterior, filtro filter e também use o seu filtro criado na segunda aula. 68 | 69 | ``` 70 |
71 | 72 | 73 | 74 |
75 |
76 | 77 | function ProfessorController() { 78 | var vm = this; 79 | vm.titulo = "Be MEAN - Listagem dos professores"; 80 | vm.professores = [ 81 | {name: 'Suissa', age: 28, id: 1} 82 | , {name: 'John Papa', age: 34, id: 2} 83 | , {name: 'Nicholas Zakas', age: 35, id: 3} 84 | ]; 85 | vm.order = order; 86 | vm.addProf = addProf; 87 | 88 | function order(key) { 89 | vm.predicate = key; 90 | vm.reverse = !vm.reverse; 91 | } 92 | 93 | function addProf(professor) { 94 | vm.professores.push(angular.copy(professor)); 95 | } 96 | } 97 | ``` 98 | -------------------------------------------------------------------------------- /class-05/gkal19/class-05-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 05 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | **Data:** 1463684745 6 | 7 | ## Criar uma função para ordenar uma tabela a partir de uma coluna clicando em sua th>td ordenando pelo campo da coluna 8 | ```html 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 |
{{ key }}
{{ value }}
21 | ``` 22 | 23 | ```js 24 | vm.ordenar = ordenar; 25 | function ordenar(campo) { 26 | console.log(campo); 27 | vm.predicate = campo; 28 | vm.reverse = !vm.reverse; 29 | } 30 | ``` 31 | 32 | ## Criar mais 1 Controller para Teachers com seu form para adição, listagem (defina um Array inicial) com a ordenação do exercício anterior, filtro filter e também use o seu filtro criado na segunda aula. 33 | 34 | ```js 35 | function ProfessorController() { 36 | var vm = this; 37 | vm.titulo = "Webschool - Professores"; 38 | vm.professores = [ 39 | {Nome: 'Jean Carlo Nascimento', Idade:30, Palestrante: 'Sim'} 40 | ,{Nome: 'Vagner Kaefer', Idade:30, Palestrante:'Não definido'} 41 | ,{Nome: 'Anderson Faro', Idade:30, Palestrante:'Não definido'} 42 | ] 43 | vm.addProf = addProf; 44 | function addProf(professor) { 45 | vm.professores.push(angular.copy(professor)); 46 | } 47 | } 48 | ``` 49 | 50 | ```html 51 | 52 |

53 | 56 |
57 | 60 |
61 | 64 |

65 |
66 | ``` 67 | 68 | 69 | ```html 70 | 71 |

72 | 75 |
76 | 79 |
80 | 83 |

84 |
85 | ``` 86 | 87 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-05/gkal19/index.html) 88 | 89 | -------------------------------------------------------------------------------- /class-05/hc3/class-05-resolved-hc3-Eliel-das-Virgens.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 05 - Exercício 2 | **user:** [hc3](https://github.com/hc3) 3 | **autor:** Eliel das Virgens 4 | 5 | ## Criar uma função para ordenar uma tabela a partir de uma coluna clicando em sua th>td ordenando pelo campo da coluna 6 | ```html 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
{{ key }}
{{ value }}
20 | ``` 21 | 22 | ```html 23 | vm.ordenar = ordenar; 24 | function ordenar(campo) { 25 | console.log(campo); 26 | vm.predicate = campo; 27 | vm.reverse = !vm.reverse; 28 | } 29 | ``` 30 | 31 | ## Criar mais 1 controller para teachers com seu form para adição ,listagem defina um array inicial com a ordenação do exercício 32 | anterior , filtro filter e também use o seu filtro criado na segunda aula. 33 | 34 | ```html 35 | .controller('ProfessorController',ProfessorController); 36 | function ProfessorController() { 37 | var vm = this; 38 | vm.titulo = "Be Mean - Lista Professores"; 39 | vm.professores = [ 40 | {nome:"Jean",idade:30} 41 | ,{nome:"Jhon Papa",idade:35} 42 | ,{nome:"Addy Osmani",idade:35} 43 | ,{nome:"Linus Turvald",idade:40} 44 | ] 45 | vm.addProf = addProf; 46 | function addProf(professor) { 47 | vm.professores.push(angular.copy(professor)); 48 | } 49 | } 50 | ``` 51 | 52 | ```html 53 |

54 | 57 |
58 | 61 |

62 |
63 | 64 | ``` -------------------------------------------------------------------------------- /class-05/nicors/class-05-resolved-nicors-Nicolas-Rafael-Serrato.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 04 - Exercício 2 | **user:** [nicors](https://github.com/nicors) 3 | **autor:** Nicolas Serrato 4 | **Data:** 1499264608652 5 | 6 | 7 | ## 1- Criar uma função que para ordenar uma tabela a partir de uma coluna, clickando na sua tr>th, ordenando pelo campo da coluna. 8 | 9 | ```js 10 | vm.ordenar = ordenar; 11 | function ordenar(campo) { 12 | vm.predicate = campo; 13 | vm.reverse = !vm.reverse; 14 | } 15 | ``` 16 | 17 | ```html 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 |
{{ key }}
{{ value }}
30 | ``` 31 | 32 | 33 | 34 | ## 2- Criar mais 1 Controller para Teachers com seu form para adição, listagem (defina um Array inicial) com a ordenação do exercício anterior, filtro filter e também use o seu filtro criado na segunda aula. 35 | 36 | ```js 37 | function ProfessorController() { 38 | var vm = this; 39 | vm.titulo = "Be MEAN - Professores"; 40 | vm.professores = [ 41 | {name: 'Jean Carlo Nascimento', age: 30, id: 1} 42 | , {name: 'Amanda Vilela', age:23, id: 2} 43 | , {name: 'Itacir Ferreira Pompeu', age: 30, id: 3} 44 | ]; 45 | 46 | vm.add = add; 47 | function add(professor) { 48 | vm.professores.push(professor); 49 | } 50 | 51 | vm.ordenar = ordenar; 52 | function ordenar(campo) { 53 | vm.predicate = campo; 54 | vm.reverse = !vm.reverse; 55 | } 56 | 57 | } 58 | ``` 59 | 60 | ```html 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 |
{{ key}}
{{value}}
73 | ``` 74 | 75 | [Arquivo](index.html) `index.html` exemplo funcional. 76 | -------------------------------------------------------------------------------- /class-06/class-06-resolved-amandavilela-AmandaVilela.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 06 - Exercício 2 | 3 | Nome: Amanda Vilela 4 | 5 | Github: amandavilela 6 | 7 | Data: 04/07/2016 - 16:53 8 | 9 | ## Criar função de delete utilizando splice em vez de filter 10 | 11 | ``` 12 | vm.removeWithSplice = removeWithSplice; 13 | 14 | function removeWithSplice(users) { 15 | users.forEach(function(el, index) { 16 | if(users[index].selecionado) { 17 | users.splice(index, 1); 18 | } 19 | }); 20 | vm.users = users; 21 | } 22 | ``` 23 | -------------------------------------------------------------------------------- /class-06/class-06-resolved-ronaiza-cardoso.md: -------------------------------------------------------------------------------- 1 | # Angular - Aula 06 - Tema de Casa 2 | **user:** [yesroh](https://github.com/yesroh) 3 | **autor:** Ronaiza Cardoso 4 | **date:** 1477594685674 5 | 6 | ## Criar a função de delete utilizando splice em vez de filter. 7 | 8 | ```js 9 | vm.remove = remove; 10 | function remove(professores) { 11 | professores.forEach(function(element, index) { 12 | if (professores[index].selecionado) 13 | professores.splice(professores.indexOf(element), 1); 14 | } 15 | ) 16 | } 17 | ``` 18 | 19 | index.html 20 | -------------------------------------------------------------------------------- /class-06/gkal19/class-06-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 06 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | **Data:** 1464303587538 6 | 7 | ## Criar função de delete utilizando splice em vez de filter 8 | ```js 9 | vm.removeWithSplice = removeWithSplice; 10 | function removeWithSplice(users) { 11 | users.forEach(function(element,index) { 12 | if(users[index].selecionado) { 13 | users.splice(users.indexOf(element),1); 14 | } 15 | } 16 | }) 17 | ``` 18 | 19 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-06/gkal19/index.html) 20 | -------------------------------------------------------------------------------- /class-06/gkal19/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | BeMEAN 6 | 7 | 13 | 14 | 15 |
16 |

{{ User.titulo }}

17 |

18 | 21 |
22 | 25 |
26 | 29 |

30 | 32 | 33 | 34 | 35 | 36 | 37 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 57 | 58 | 59 |
38 | 39 |
NameEmailUsernameDeletar
{{ user.Nome }}{{ user.Email }}{{ user.Username }} 54 | 55 | 56 |
60 | 62 |
63 | 64 | 65 | 89 | 90 | -------------------------------------------------------------------------------- /class-06/hc3/class-06-resolved-hc3-Eliel-das-Virgens.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 06 - Exercício 2 | **user:** [hc3](https://github.com/hc3) 3 | **autor:** Eliel das Virgens 4 | 5 | 6 | ## Criar função de delete utilizando splice em vez de filter 7 | ```html 8 | vm.removeWithSplice = removeWithSplice; 9 | function removeWithSplice(users) { 10 | users.forEach(function(element,index) { 11 | if(users[index].selecionado) { 12 | users.splice(users.indexOf(element),1); 13 | } 14 | } 15 | }) 16 | ``` -------------------------------------------------------------------------------- /class-06/igopdm/class-06-resolved-IgoMedeiros-Igo-Medeiros.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.8 - Aula 06 - Exercício 2 | **user:** [igomedeiros](https://github.com/igomedeiros) 3 | **autor:** Igo Medeiros 4 | 5 | 6 | ## Criar função de delete utilizando splice em vez de filter 7 | ```html 8 | vm.remove = remove; 9 | function remove(users) { 10 | for(user in users){ 11 | if (users[user].selecionado) { 12 | users.splice(user, 1); 13 | } 14 | } 15 | } 16 | ``` -------------------------------------------------------------------------------- /class-06/igopdm/ex06.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Exercício 06 - Delete 6 | 7 | 13 | 14 | 15 | 16 |
17 |

{{ User.titulo }}

18 |

19 | 22 |
23 | 26 |

27 | 29 | 30 | 31 | 32 | 33 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 51 | 52 | 53 | 54 | 55 |
34 | 37 |
NameEmail
48 | 49 | 50 | {{ user.name }}{{ user.email }}
56 | 58 |
59 | 60 | 61 | 90 | 91 | -------------------------------------------------------------------------------- /class-06/willianlauber/class-06-resolved-willianlauber-WILLIAN-ALBERTO-LAUBER.md: -------------------------------------------------------------------------------- 1 | # Angular - Aula 06 - Tema de Casa 2 | **user:** [willianlauber](https://github.com/willianlauber) 3 | **autor:** Willian Lauber 4 | **date:** 1475556248 5 | 6 | ## Criar a função de delete utilizando splice em vez de filter. 7 | 8 | ```js 9 | vm.remove = remove; 10 | function remove(professores) { 11 | professores.forEach(function(element, index) { 12 | if (professores[index].selecionado) 13 | professores.splice(professores.indexOf(element), 1); 14 | } 15 | ) 16 | } 17 | ``` 18 | 19 | index.html 20 | -------------------------------------------------------------------------------- /class-07/class-07-resolved-amandavilela-AmandaVilela.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1 - Aula 07 - Exercício 2 | 3 | Nome: Amanda Vilela 4 | 5 | Github: amandavilela 6 | 7 | Data: 04/07/2016 - 17:32 8 | 9 | ## Fazer a função de save no Controller de professores e utilizar forEach em vez de map. 10 | 11 | ``` 12 | function save(professor) { 13 | vm.professores.forEach(function update(value, index) { 14 | if(professor.index === index) { 15 | vm.professores.splice(professor.index, 1, professor); 16 | } 17 | }); 18 | } 19 | ``` 20 | -------------------------------------------------------------------------------- /class-07/gkal19/class-07-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 07 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 | 5 | **Data** 1464870705 6 | 7 | ## Fazer a função de `save` no Controller de professores e utilizar `forEach` em vez de `map`. 8 | ```html 9 | 10 | ``` 11 | ```js 12 | vm.saveProf = saveProf; 13 | function saveProf(professor) { 14 | vm.professores.forEach(function (value,index) { 15 | if(professor.index === index) { 16 | vm.professores.splice(professor.index,1,professor); 17 | } 18 | }); 19 | } 20 | ``` 21 | 22 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-07/gkal19/index.html) 23 | -------------------------------------------------------------------------------- /class-07/hc3/class-07-resolved-hc3-Eliel-das-Virgens.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 07 - Exercício 2 | **user:** [hc3](https://github.com/hc3) 3 | **autor:** Eliel das Virgens 4 | 5 | ## Fazer a função de save no Controller de professores e utilizar forEach em vez de map. 6 | ```html 7 | vm.saveWithForEach = saveWithForEach; 8 | function saveWithForEach(professor) { 9 | vm.professores.forEach(function alterar(value,index) { 10 | if(professor.index === index) { 11 | vm.professores.splice(professor.index,1,professor); 12 | } 13 | }); 14 | } 15 | ``` -------------------------------------------------------------------------------- /class-07/willianlauber/class-07-resolved-willianlauber-Willian-Alberto-Lauber.md: -------------------------------------------------------------------------------- 1 | # Angular - Aula 07 - Exercício 2 | **user:** [willianlauber](https://github.com/willianlauber) 3 | **autor:** WILLIAN ALBERTO LAUBER 4 | **date** 1475613100 5 | 6 | ## Fazer a função de save no Controller de professores e utilizar forEach em vez de map. 7 | ```js 8 | vm.saveWithForEach = saveWithForEach; 9 | function saveWithForEach(professor) { 10 | vm.professores.forEach(function alterar(value,index) { 11 | if(professor.index === index) 12 | vm.professores.splice(professor.index,1,professor); 13 | }); 14 | } 15 | ``` 16 | -------------------------------------------------------------------------------- /class-08/gkal19/class-08-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 08 - Exercício 2 | **user:** [gkal19](https://github.com/gkal19) 3 | **autor:** Gabriel Kalani 4 |
5 | **Data** 1465218540 6 | 7 | 8 | ## Criar a mesma lógica de animação do botão save para o botão edit porem utilizando a uma animação de css diferente. 9 | 10 | ```html 11 |
13 | ``` 14 | 15 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-08/gkal19/index.html) 16 | -------------------------------------------------------------------------------- /class-08/hc3/class-08-resolved-hc3-Eliel-das-Virgens.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 08 - Exercício 2 | **user:** [hc3](https://github.com/hc3) 3 | **autor:** Eliel das Virgens 4 | 5 | ## Criar a mesma lógica de animação do botão save para o botão edit porem utilizando a uma animação de css diferente. 6 | 7 | código do exercício está na pagina index.html. 8 | -------------------------------------------------------------------------------- /class-09/gkal19/class-09-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 09 - Exercício 2 | **User:** [gkal19](https://github.com/gkal19) 3 | **Autor:** Gabriel Kalani 4 | **Data:** 1466005568493 5 | 6 | ## Criar uma animação melhor com `keyframes` para entrada do usuário na lista. 7 | 8 | ```html 9 | 10 | ``` 11 | ## Criar uma animação melhor com `keyframes` para saída do usuário na lista. 12 | 13 | ```html 14 | 16 | ``` 17 | ## Criar uma animação melhor com `keyframes` para busca do usuário na lista. 18 | 19 | ```html 20 | 23 | ``` 24 | 25 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-09/gkal19/index.html) 26 | -------------------------------------------------------------------------------- /class-10/alexmcoder/class-10-resolved-AlexMCoder-Alex-Morgado-Pereira.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 10 - Exercício 2 | 3 | **User:** [AlexMCoder](https://github.com/AlexMCoder) 4 | 5 | **Autor:** Alex Morgado Pereira 6 | 7 | ### 1 - Criar uma funcionalidade para estilizar a linha da tabela quando o usuário for selecionado, via checkbox. 8 | ```html 9 | 10 | ``` 11 | 12 | ```css 13 | .selectedCheck { 14 | background: rgba(162, 161, 161, 0.21); 15 | border: 1px solid #aaa; 16 | color: blue; 17 | font-weight: bold; 18 | } 19 | ``` 20 | 21 | 22 | 23 | ### 2 - Criar mais 2 classes condicionais quando o elemento é selecionado. 24 | 25 | ```html 26 | {{ user.name }} 27 | {{ user.email }} 28 | ``` 29 | 30 | ```CSS 31 | .nameSelect, .emailSelect { 32 | text-transform: uppercase; 33 | -webkit-transition: 2s; 34 | transition: 2s; 35 | } 36 | ``` 37 | 38 | ### 3 - Zebrar a lista utilizando um teste ternário. 39 | 40 | ```CSS 41 | .trStart tr:nth-child(even){ 42 | background: #000; 43 | color: #FFF; 44 | } 45 | 46 | .trEnd tr:nth-child(odd){ 47 | background: #FFF; 48 | color: #000; 49 | } 50 | ``` 51 | 52 | ```html 53 | 54 | ``` 55 | 56 | ### 4 - Utilize o `ng-if` para estilizar, na listagem dos usuários quando um elemento está sendo editado. 57 | ```html 58 | 59 | 60 | 61 | ``` 62 | -------------------------------------------------------------------------------- /class-10/ednilsonamaral/class-10-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 09 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468801243285 5 | 6 | 7 | ## Criar uma funcionalidade para estilizar a linha da tabela quando o usuário for selecionado, via *checkbox*. 8 | 9 | ```html 10 | 11 | ``` 12 | 13 | ```css 14 | .trSelecionado{ 15 | background: #808080; 16 | border: 10px dashed #4CAF50; 17 | color: #fff; 18 | } 19 | ``` 20 | 21 | ## Criar mais 2 classes condicionais quando o elemento é selecionado. 22 | 23 | ```html 24 | 25 | 26 | ``` 27 | 28 | ```css 29 | .nameSelecionado{ 30 | text-transform: uppercase; 31 | color: #3d3d3d; 32 | font-weight: bolder; 33 | } 34 | 35 | .emailSelecionado{ 36 | text-decoration: underline; 37 | color: blue; 38 | cursor: pointer; 39 | } 40 | ``` 41 | 42 | ## Zebrar a lista utilizando um teste ternário no ng-class. 43 | 44 | ```html 45 |
{{ user.name }}{{ user.email }}
46 | ``` 47 | 48 | ```css 49 | .trEven tr:nth-child(even){ 50 | background: #000; 51 | color: #FFF; 52 | } 53 | 54 | .trOdd tr:nth-child(odd){ 55 | background: #FFF; 56 | color: #000; 57 | } 58 | ``` 59 | 60 | ## Utilize o ng-if para estilizar, na listagem dos usuários, quando um elemento está sendo editado. 61 | 62 | Quando o **SAVE** ficar visivel, o **ADD** vai ficar oculto. 63 | 64 | 65 | ```html 66 | 67 | 68 | 69 | ``` 70 | 71 | 72 | [Arquivo HTML](exercicio.html) 73 | -------------------------------------------------------------------------------- /class-10/gkal19/class-10-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 10 - Exercício 2 | 3 | **User:** [gkal19](https://github.com/gkal19) 4 | 5 | **Autor:** Gabriel Kalani 6 | 7 | **Data** 1467898660701 8 | 9 | ### 1 - Criar uma funcionalidade para estilizar a linha da tabela quando o usuário for selecionado, via checkbox. 10 | ```html 11 | 12 | 16 | ``` 17 |
18 | ```css 19 | /* Arquivo CSS */ 20 | .selected { 21 | font-weight: lighter; 22 | text-decoration: line-through; 23 | } 24 | ``` 25 | 26 | 27 | 28 | ### 2 - Criar mais 2 classes condicionais quando o elemento é selecionado. 29 | ```html 30 | 31 | 32 | ``` 33 | 34 | ```css 35 | .condicional1{ 36 | text-transform: uppercase; 37 | color: #000; 38 | font-weight: bolder; 39 | } 40 | .condicional2{ 41 | text-decoration: lowercase; 42 | color: #000; 43 | cursor: pointer; 44 | } 45 | ``` 46 | 47 | ### 3 - Zebrar a lista utilizando um teste ternário. 48 | > Explicando: Primeiramente utilizando a `Table` apenas acrescentei um `class="tabela"` a ela e acrescentei também o seguinte CSS... 49 | 50 | ```CSS 51 | .tabela tbody tr:nth-child(even) { 52 | background-color: #CCC; 53 | } 54 | .tabela tbody tr:nth-child(odd) { 55 | background-color: #FFF; 56 | } 57 | ``` 58 | 59 | > Selecionei os elementos pares e ímpares assim precisando só acrescentar a classe `tabela` no `
13 | 14 | 15 | {{ user.name }}{{ user.email }}
`. 60 | 61 | ### 4 - Utilize o `ng-if` para estilizar, na listagem dos usuários quando um elemento está sendo editado. 62 | ```html 63 | 64 | ``` 65 | 66 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-10/gkal19/index.html) 67 | -------------------------------------------------------------------------------- /class-10/gkal19/error.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-10/gkal19/error.png -------------------------------------------------------------------------------- /class-10/gkal19/searchicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-10/gkal19/searchicon.png -------------------------------------------------------------------------------- /class-10/magnumcortez/class-10-resolved-MagnumCortez-Magnum-Cortez.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 10 - Exercício 2 | **user:** [MagnumCortez](https://github.com/MagnumCortez) 3 | 4 | **autor:** Magnum cortez 5 | 6 | 7 | ### 1 - Criar uma funcionalidade para estilizar a linha da tabela quando o usuário for selecionado, via checkbox, com **nf-style**. 8 | ```html 9 | 10 | ``` 11 | 12 | ```CSS 13 | vm.lineStyle = lineStyle; 14 | function lineStyle(selecionado) { 15 | return (selecionado) ? 'antiquewhite' : 'greenyellow'; 16 | } 17 | ``` 18 | 19 | ### 2 - Criar mais 2 classes condicionais quando o elemento é selecionado com **ng-class**. 20 | 21 | ```html 22 | 23 | ``` 24 | 25 | ```CSS 26 | .lineChecked { 27 | background-color: antiquewhite; 28 | font-weight: bold; 29 | text-decoration: line-through; 30 | color: red; 31 | } 32 | .lineUnChecked { 33 | background-color: greenyellow; 34 | text-decoration: underline; 35 | } 36 | ``` 37 | 38 | ### 3 - Zebrar a lista utilizando um teste ternário no **ng-class**. 39 | 40 | ```html 41 | 42 | ``` 43 | 44 | ```CSS 45 | .grayLine { 46 | background-color: #EEE; 47 | } 48 | .whiteLine { 49 | background-color: #FFF; 50 | } 51 | ``` 52 | 53 | ### 4 - Utilize o **ng-if** para estilizar, na listagem dos usuários quando um elemento está sendo editado. 54 | 55 | ```html 56 | 57 | 58 | 59 | ``` -------------------------------------------------------------------------------- /class-10/willianlauber/class-10-resolved-willianlauber-Willian-Lauber.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 10 - Exercício 2 | 3 | **User:** [willianlauber](https://github.com/willianlauber) 4 | 5 | **Autor:** Willian Lauber 6 | 7 | **Data** 1475782828 8 | 9 | ### 1 - Criar uma funcionalidade para estilizar a linha da tabela quando o usuário for selecionado, via checkbox. 10 | ```html 11 | 12 | ``` 13 | 14 | ```css 15 | .red{ 16 | color: white; 17 | font-weight: bold; 18 | background-color: white; 19 | } 20 | .class { 21 | font-size:1.2em; 22 | text-shadow: 0 2 1 blue; 23 | transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s; 24 | } 25 | ``` 26 | 27 | 28 | 29 | ### 2 - Criar mais 2 classes condicionais quando o elemento é selecionado. 30 | 31 | ```html 32 | 33 | ``` 34 | 35 | ```CSS 36 | .red{ 37 | color: white; 38 | font-weight: bold; 39 | background-color: white; 40 | } 41 | .class { 42 | font-size:1.2em; 43 | text-shadow: 0 2 1 blue; 44 | transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s; 45 | } 46 | ``` 47 | 48 | ### 3 - Zebrar a lista utilizando um teste ternário. 49 | 50 | 51 | ```html 52 | 53 | ``` 54 | 55 | ### 4 - Utilize o `ng-if` para estilizar, na listagem dos usuários quando um elemento está sendo editado. 56 | ```html 57 | 19 | 20 | 24 | 25 | 26 | 27 | 28 | 31 | 32 | 33 | ``` 34 | 35 | -------------------------------------------------------------------------------- /class-11/ednilsonamaral/class-11-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 11 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468814650398 5 | 6 | 7 | ## Adicionar ordenação no `ng-options`. 8 | 9 | ```html 10 | 13 | ``` 14 | 15 | ## Criar lógica para desabilitar a linha do usuário quando ele está sendo editado. 16 | 17 | Adicionei a diretiva no `tr`, no `checkbox` e no *button* de *edit*. 18 | 19 | ```html 20 | 21 | 25 | 26 | 27 | 28 | 29 | 32 | 33 | ``` 34 | 35 | 36 | [Arquivo HTML](exercicio.html) 37 | -------------------------------------------------------------------------------- /class-11/magnumcortez/class-11-resolved-MagnumCortez-Magnum-Cortez.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 11 - Exercício 2 | **user:** [MagnumCortez](https://github.com/MagnumCortez) 3 | 4 | **autor:** Magnum cortez 5 | 6 | ## Adicionar ordenação no *ng-options*. 7 | 8 | ```html 9 | 12 | ``` 13 | 14 | ## Criar lógica para desabilitar a linha do usuário quando ele está sendo editado. 15 | 16 | ```html 17 | 18 | 22 | {{ user.name }} 23 | 24 | 25 | 26 | 29 | 30 | ``` 31 | 32 | ```Controller 33 | vm.userEditing = []; 34 | 35 | vm.edit = edit; 36 | function edit(user, index) { 37 | vm.userEditing = []; 38 | vm.userEditing[index] = true; 39 | vm.form = angular.copy(user); 40 | vm.form.index = index; 41 | vm.editing = true; 42 | console.log('vm.userEditing',vm.userEditing) 43 | } 44 | 45 | vm.save = save; 46 | function save(user) { 47 | vm.userEditing = []; 48 | var users = vm.users.map(function(el, i) { 49 | if (i === user.index) { 50 | delete user.index; 51 | return user; 52 | } 53 | return el; 54 | }); 55 | vm.users = angular.copy(users); 56 | vm.editing = false; 57 | vm.form = {}; 58 | } 59 | ``` -------------------------------------------------------------------------------- /class-11/willianlauber/class-11-resolved-willianlauber-Willian-Alberto-Lauber.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 11 - Exercício 2 | **user:** [willianlauber](https://github.com/willianlauber) 3 | **autor:** Willian Alberto Lauber 4 | **data:** 1482682476 5 | 6 | 7 | ## Adicionar ordenação no `ng-options`. 8 | 9 | ```html 10 |

{{Teach.titulo}}

11 | 12 | 15 | 16 | ``` 17 | 18 | ## Criar lógica para desabilitar a linha do usuário quando ele está sendo editado. 19 | 20 | 21 | ```html 22 | 23 | ... 24 | 27 | ``` 28 | 29 | 30 | [Arquivo HTML](index.html) 31 | -------------------------------------------------------------------------------- /class-12/ednilsonamaral/app.js: -------------------------------------------------------------------------------- 1 | angular.module('BeMEAN', ['ngAnimate']) 2 | .controller('UserController', UserController); 3 | 4 | function UserController() { 5 | var vm = this; 6 | 7 | vm.form = {}; 8 | vm.titulo = "Be MEAN - Usuários"; 9 | vm.editing = false; 10 | vm.reverse = false; 11 | vm.tituloStyleClass = "h1"; 12 | 13 | vm.users = [ 14 | {name: 'Suissa', email: 'suissera@manoveio.com', type: 'teacher', active: true}, 15 | {name: 'João', email: 'joao@macioesedoso.com', type: 'student', active: false}, 16 | {name: 'Franciele', email: 'fran@quimica.com', type: 'teacher', active: false}, 17 | {name: 'Maria', email: 'm@gmail.com', type: 'student', active: true}, 18 | {name: 'Jose', email: 'js@gmail.com', type: 'student', active: true} 19 | ]; 20 | 21 | vm.lista_com_valor_inicial = vm.users[0].email; 22 | 23 | function getKeyLength() { 24 | return Object.keys(angular.copy(vm.users[0])).length; 25 | } 26 | vm.keysLength = getKeyLength(); 27 | 28 | 29 | function orderByName(){ 30 | vm.predicate = 'name'; 31 | vm.reverse = !vm.reverse; 32 | } 33 | vm.orderByName = orderByName; 34 | 35 | function orderByEmail(){ 36 | vm.predicate = 'email'; 37 | vm.reverse = !vm.reverse; 38 | } 39 | vm.orderByEmail = orderByEmail; 40 | 41 | vm.add = add; 42 | function add(user) { 43 | if (vm.users.name.$valid) { 44 | vm.users.push(angular.copy(user)); 45 | vm.form = {}; 46 | } else { 47 | console.log("FUUUUDEU, DEU MERDA!!!"); 48 | } 49 | } 50 | 51 | vm.remove = remove; 52 | function remove(users) { 53 | vm.users = users.filter(function(el){ return !el.selecionado }); 54 | } 55 | 56 | vm.edit = edit; 57 | function edit(user, index) { 58 | vm.form = angular.copy(user); 59 | vm.form.index = index; 60 | vm.editing = true; 61 | } 62 | 63 | vm.save = save; 64 | function save(user) { 65 | function saveUser(el, i){ 66 | if(i === user.index) { 67 | delete user.index; 68 | return angular.copy(user); 69 | } 70 | return el; 71 | } 72 | 73 | var users = vm.users.map(saveUser); 74 | vm.users = users; 75 | vm.editing = false; 76 | vm.form = {}; 77 | } 78 | 79 | vm.submitForm = submitForm; 80 | function submitForm(user) { 81 | add(user); 82 | } 83 | } 84 | -------------------------------------------------------------------------------- /class-12/ednilsonamaral/class-12-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 12 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 5 | 6 | 7 | ## Não deixar que seja adicionado um usuário que seja inválido. 8 | 9 | ```js 10 | vm.add = add; 11 | function add(user) { 12 | if (vm.users.name.$valid) { 13 | vm.users.push(angular.copy(user)); 14 | vm.form = {}; 15 | } else { 16 | console.log("FUUUUDEU, DEU MERDA!!!"); 17 | } 18 | } 19 | ``` 20 | 21 | 22 | * [Arquivo HTML](exercicio.html) 23 | * [Arquivo styles.css](styles.css) 24 | * [Arquivo app.js](app.js) 25 | -------------------------------------------------------------------------------- /class-12/ednilsonamaral/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bold; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .animate{ 22 | transition: all linear 0.5s; 23 | } 24 | 25 | .ng-hide{ 26 | height: 0; 27 | } 28 | 29 | .item.ng-enter{ 30 | transition: all linear 0.5s; 31 | } 32 | 33 | .item.ng-enter{ 34 | opacity: 0; 35 | } 36 | 37 | .item.ng-enter.ng-enter-active{ 38 | color: #4CAF50; 39 | font-weight: bold; 40 | font-size: 1.2rem; 41 | opacity: 1; 42 | } 43 | 44 | .item.ng-leave{ 45 | transition: all linear 0.5s; 46 | } 47 | 48 | .item.ng-leave{ 49 | opacity: 0; 50 | } 51 | 52 | .item.ng-leave.ng-leave-active{ 53 | opacity: 1; 54 | } 55 | 56 | .item.ng-move{ 57 | transition: all linear 1s; 58 | } 59 | 60 | .item.ng-move{ 61 | opacity: 0; 62 | } 63 | 64 | .item.ng-move.ng-move-active{ 65 | opacity: 1; 66 | } 67 | 68 | .bold{ 69 | font-weight: bold; 70 | } 71 | 72 | .strike{ 73 | text-decoration: line-through; 74 | } 75 | 76 | .ng-valid{ 77 | background-color: #B4E5C4; 78 | } 79 | 80 | .dirty{ 81 | background-color: #ccc; 82 | } 83 | 84 | .invalid{ 85 | background-color: red; 86 | } 87 | -------------------------------------------------------------------------------- /class-12/magnumcortez/class-12-resolved-MagnumCortez-Magnum-Cortez.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 12 - Exercício 2 | **user:** [MagnumCortez](https://github.com/MagnumCortez) 3 | 4 | **autor:** Magnum cortez 5 | 6 | ## Não deixar que seja adicionado um usuário inválido. 7 | 8 | ```html 9 | 10 | ``` 11 | 12 | 13 | ```js 14 | vm.submitForm = submitForm; 15 | function submitForm(user) { 16 | if (user.$valid) { 17 | add(user); 18 | } else { 19 | console.log('Erro ao adicionar usuário'); 20 | } 21 | } 22 | ``` 23 | -------------------------------------------------------------------------------- /class-13/ednilsonamaral/app.js: -------------------------------------------------------------------------------- 1 | angular.module('BeMEAN', ['ngAnimate', 'ngMessages']) 2 | .controller('UserController', UserController); 3 | 4 | function UserController() { 5 | var vm = this; 6 | 7 | vm.form = {}; 8 | vm.titulo = "Be MEAN - Usuários"; 9 | vm.editing = false; 10 | vm.reverse = false; 11 | vm.tituloStyleClass = "h1"; 12 | 13 | vm.regexPhone = /9?([0-9]{4})-?([0-9]{4})/; 14 | vm.dateError = /(0[1-9]|1[0-9]|2[0-9]|3[01])-(0[1-9]|1[012])-[0-9]{4}/; 15 | vm.numError = /[-+]?[0-9]*[.,]?[0-9]+/; 16 | vm.pwdError = /(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$/; 17 | 18 | vm.users = [ 19 | {name: 'Suissa', email: 'suissera@manoveio.com', type: 'teacher', active: true}, 20 | {name: 'João', email: 'joao@macioesedoso.com', type: 'student', active: false}, 21 | {name: 'Franciele', email: 'fran@quimica.com', type: 'teacher', active: false}, 22 | {name: 'Maria', email: 'm@gmail.com', type: 'student', active: true}, 23 | {name: 'Jose', email: 'js@gmail.com', type: 'student', active: true} 24 | ]; 25 | 26 | vm.lista_com_valor_inicial = vm.users[0].email; 27 | 28 | function getKeyLength() { 29 | return Object.keys(angular.copy(vm.users[0])).length; 30 | } 31 | vm.keysLength = getKeyLength(); 32 | 33 | 34 | function orderByName(){ 35 | vm.predicate = 'name'; 36 | vm.reverse = !vm.reverse; 37 | } 38 | vm.orderByName = orderByName; 39 | 40 | function orderByEmail(){ 41 | vm.predicate = 'email'; 42 | vm.reverse = !vm.reverse; 43 | } 44 | vm.orderByEmail = orderByEmail; 45 | 46 | vm.add = add; 47 | function add(user) { 48 | if (vm.users.name.$valid) { 49 | vm.users.push(angular.copy(user)); 50 | vm.form = {}; 51 | } else { 52 | console.log("FUUUUDEU, DEU MERDA!!!"); 53 | } 54 | } 55 | 56 | vm.remove = remove; 57 | function remove(users) { 58 | vm.users = users.filter(function(el){ return !el.selecionado }); 59 | } 60 | 61 | vm.edit = edit; 62 | function edit(user, index) { 63 | vm.form = angular.copy(user); 64 | vm.form.index = index; 65 | vm.editing = true; 66 | } 67 | 68 | vm.save = save; 69 | function save(user) { 70 | function saveUser(el, i){ 71 | if(i === user.index) { 72 | delete user.index; 73 | return angular.copy(user); 74 | } 75 | return el; 76 | } 77 | 78 | var users = vm.users.map(saveUser); 79 | vm.users = users; 80 | vm.editing = false; 81 | vm.form = {}; 82 | } 83 | 84 | vm.submitForm = submitForm; 85 | function submitForm(user) { 86 | add(user); 87 | } 88 | } 89 | -------------------------------------------------------------------------------- /class-13/ednilsonamaral/class-13-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 13 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468899499662 5 | 6 | 7 | ## Criar um `input` do tipo `date`, sua validação e mensagem de validação. 8 | 9 | ```html 10 |
11 | 12 | 13 |

14 | User.userForm.date.$error: {{ User.userForm.date.$error }} 15 |

16 | 17 |
18 |

A data nao esta no padrao, fdp!

19 |
20 |
21 | ``` 22 | 23 | ```js 24 | vm.dateError = /(0[1-9]|1[0-9]|2[0-9]|3[01])-(0[1-9]|1[012])-[0-9]{4}/; 25 | ``` 26 | 27 | 28 | ## Criar um `input` do tipo `number`, sua validação e mensagem de validação. 29 | 30 | ```html 31 |
32 | 33 | 34 |

35 | User.userForm.num.$error: {{ User.userForm.num.$error }} 36 |

37 | 38 |
39 |

O num nao esta no padrao, fdp!

40 |
41 |
42 | ``` 43 | 44 | ```js 45 | vm.numError = /[-+]?[0-9]*[.,]?[0-9]+/; 46 | ``` 47 | 48 | 49 | ## Criar um `input` do tipo `password`, sua validação e mensagem de validação. 50 | 51 | ```html 52 |
53 | 54 | 55 |

56 | User.userForm.pwd.$error: {{ User.userForm.pwd.$error }} 57 |

58 | 59 |
60 |

Sua senha nao esta no padrao, fdp! Tem que ter no minimo 8 caracteres!!!

61 |
62 |
63 | ``` 64 | 65 | ```js 66 | vm.pwdError = /(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$/; 67 | ``` 68 | 69 | 70 | ## Passe todas as mensagens para `ng-messages`. 71 | 72 | 73 | * [Arquivo HTML](exercicio.html) 74 | * [Arquivo styles.css](styles.css) 75 | * [Arquivo app.js](app.js) 76 | -------------------------------------------------------------------------------- /class-13/ednilsonamaral/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bold; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .animate{ 22 | transition: all linear 0.5s; 23 | } 24 | 25 | .ng-hide{ 26 | height: 0; 27 | } 28 | 29 | .item.ng-enter{ 30 | transition: all linear 0.5s; 31 | } 32 | 33 | .item.ng-enter{ 34 | opacity: 0; 35 | } 36 | 37 | .item.ng-enter.ng-enter-active{ 38 | color: #4CAF50; 39 | font-weight: bold; 40 | font-size: 1.2rem; 41 | opacity: 1; 42 | } 43 | 44 | .item.ng-leave{ 45 | transition: all linear 0.5s; 46 | } 47 | 48 | .item.ng-leave{ 49 | opacity: 0; 50 | } 51 | 52 | .item.ng-leave.ng-leave-active{ 53 | opacity: 1; 54 | } 55 | 56 | .item.ng-move{ 57 | transition: all linear 1s; 58 | } 59 | 60 | .item.ng-move{ 61 | opacity: 0; 62 | } 63 | 64 | .item.ng-move.ng-move-active{ 65 | opacity: 1; 66 | } 67 | 68 | .bold{ 69 | font-weight: bold; 70 | } 71 | 72 | .strike{ 73 | text-decoration: line-through; 74 | } 75 | 76 | .ng-valid{ 77 | background-color: #B4E5C4; 78 | } 79 | 80 | .dirty{ 81 | background-color: #ccc; 82 | } 83 | 84 | .invalid{ 85 | background-color: red; 86 | } 87 | -------------------------------------------------------------------------------- /class-14/ednilsonamaral/app.js: -------------------------------------------------------------------------------- 1 | angular.module('BeMEAN', ['ngAnimate']) 2 | .controller('UserController', UserController); 3 | 4 | function UserController() { 5 | var vm = this; 6 | 7 | vm.form = {}; 8 | vm.titulo = "Be MEAN - Usuários"; 9 | vm.editing = false; 10 | vm.reverse = false; 11 | vm.tituloStyleClass = "h1"; 12 | 13 | vm.users = [ 14 | {name: 'Suissa', email: 'suissera@manoveio.com', type: 'teacher', active: true}, 15 | {name: 'João', email: 'joao@macioesedoso.com', type: 'student', active: false}, 16 | {name: 'Franciele', email: 'fran@quimica.com', type: 'teacher', active: false}, 17 | {name: 'Maria', email: 'm@gmail.com', type: 'student', active: true}, 18 | {name: 'Jose', email: 'js@gmail.com', type: 'student', active: true} 19 | ]; 20 | 21 | vm.lista_com_valor_inicial = vm.users[0].email; 22 | 23 | function getKeyLength() { 24 | return Object.keys(angular.copy(vm.users[0])).length; 25 | } 26 | vm.keysLength = getKeyLength(); 27 | 28 | 29 | function orderByName(){ 30 | vm.predicate = 'name'; 31 | vm.reverse = !vm.reverse; 32 | } 33 | vm.orderByName = orderByName; 34 | 35 | function orderByEmail(){ 36 | vm.predicate = 'email'; 37 | vm.reverse = !vm.reverse; 38 | } 39 | vm.orderByEmail = orderByEmail; 40 | 41 | vm.add = add; 42 | function add(user) { 43 | if (vm.users.name.$valid) { 44 | vm.users.push(angular.copy(user)); 45 | vm.form = {}; 46 | } else { 47 | console.log("FUUUUDEU, DEU MERDA!!!"); 48 | } 49 | } 50 | 51 | vm.remove = remove; 52 | function remove(users) { 53 | vm.users = users.filter(function(el){ return !el.selecionado }); 54 | } 55 | 56 | vm.edit = edit; 57 | function edit(user, index) { 58 | vm.form = angular.copy(user); 59 | vm.form.index = index; 60 | vm.editing = true; 61 | } 62 | 63 | vm.save = save; 64 | function save(user) { 65 | function saveUser(el, i){ 66 | if(i === user.index) { 67 | delete user.index; 68 | return angular.copy(user); 69 | } 70 | return el; 71 | } 72 | 73 | var users = vm.users.map(saveUser); 74 | vm.users = users; 75 | vm.editing = false; 76 | vm.form = {}; 77 | } 78 | 79 | vm.submitForm = submitForm; 80 | function submitForm(user) { 81 | add(user); 82 | } 83 | } 84 | -------------------------------------------------------------------------------- /class-14/ednilsonamaral/class-14-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 14 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468941609004 5 | 6 | 7 | ## Criar em cima desse exemplo mais 3 exemplos com outros eventos não mostrados na aula e outros valores. 8 | 9 | Utilizei os seguintes exemplos: 10 | 11 | * `getterSetter`; 12 | * `allowInvalid`; 13 | * `timezone`. 14 | 15 | 16 | ```html 17 | 20 | 21 |
22 | 23 | 26 | 27 | 30 | ``` 31 | 32 | 33 | * [Arquivo HTML](exercicio.html) 34 | * [Arquivo styles.css](styles.css) 35 | * [Arquivo app.js](app.js) 36 | -------------------------------------------------------------------------------- /class-14/ednilsonamaral/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bold; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .animate{ 22 | transition: all linear 0.5s; 23 | } 24 | 25 | .ng-hide{ 26 | height: 0; 27 | } 28 | 29 | .item.ng-enter{ 30 | transition: all linear 0.5s; 31 | } 32 | 33 | .item.ng-enter{ 34 | opacity: 0; 35 | } 36 | 37 | .item.ng-enter.ng-enter-active{ 38 | color: #4CAF50; 39 | font-weight: bold; 40 | font-size: 1.2rem; 41 | opacity: 1; 42 | } 43 | 44 | .item.ng-leave{ 45 | transition: all linear 0.5s; 46 | } 47 | 48 | .item.ng-leave{ 49 | opacity: 0; 50 | } 51 | 52 | .item.ng-leave.ng-leave-active{ 53 | opacity: 1; 54 | } 55 | 56 | .item.ng-move{ 57 | transition: all linear 1s; 58 | } 59 | 60 | .item.ng-move{ 61 | opacity: 0; 62 | } 63 | 64 | .item.ng-move.ng-move-active{ 65 | opacity: 1; 66 | } 67 | 68 | .bold{ 69 | font-weight: bold; 70 | } 71 | 72 | .strike{ 73 | text-decoration: line-through; 74 | } 75 | 76 | .ng-valid{ 77 | background-color: #B4E5C4; 78 | } 79 | 80 | .dirty{ 81 | background-color: #ccc; 82 | } 83 | 84 | .invalid{ 85 | background-color: red; 86 | } 87 | -------------------------------------------------------------------------------- /class-14/gkal19/class-14-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 14 - Exercício 2 | 3 | **User:** [gkal19](https://github.com/gkal19) 4 | 5 | **Autor:** Gabriel Kalani 6 | 7 | **Data** 1468638632383 8 | 9 | ### 1 - Criar em cima desse exemplo mais 3 exemplos com outro eventos não mostrados na aula e outros valores. 10 | > Exemplo 01: getterSetter 11 | 12 | ```html 13 |
14 |
15 |
16 | 17 |
18 | 19 | 20 |
21 |

22 | Busca: {{ searchUser }} 23 |

24 |
25 |
26 | ``` 27 | 28 | > Exemplo 02: Time Zone GILT 29 | 30 | ```html 31 |
32 |
33 |
34 | 37 | 
GILT Time Zone: {{ GILTTime }}
38 |
39 |
40 |
41 | ``` 42 | 43 | ```js 44 | 52 | ``` 53 | 54 | > Exemplo 03: Debounce 55 | ```html 56 |
57 |
58 |
59 | 63 | 64 |
65 | 
Olá,
66 |
67 |
68 |
69 | ``` 70 | 71 | > Não sei se fiz certo, se errei posso tentar fazer denovo. 72 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-14/gkal19/index.html) -------------------------------------------------------------------------------- /class-14/gkal19/error.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-14/gkal19/error.png -------------------------------------------------------------------------------- /class-14/gkal19/searchicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-14/gkal19/searchicon.png -------------------------------------------------------------------------------- /class-15/ednilsonamaral/class-15-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 15 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468962226790 5 | 6 | 7 | ## Refatorar a View para mostrar os dados em um Form. 8 | 9 | ```html 10 |
11 |
12 | 13 | 14 | 15 |


16 | 17 | 18 | 19 | 20 |
21 | ``` 22 | 23 | * [Arquivos](/exercicio01) 24 | 25 | ## Criar mais 1 rota que busque pelo **email**. 26 | 27 | `users.html` 28 | ```html 29 | 30 | ``` 31 | 32 | `user-details.html` 33 | ```html 34 |

Buscar o user pelo email: {{ UserDetails.routeParams.email }}

35 | 36 |

37 | Nome: {{ UserDetails.users[UserDetails.routeParams.users.email].name }} 38 | 39 |
40 | 41 | Email: {{ UserDetails.users[UserDetails.routeParams.users.email].email }} 42 |

43 | ``` 44 | 45 | `app.js` 46 | ```js 47 | .when('/users/:email', { 48 | templateUrl: 'views/user-details.html', 49 | controller: 'UserDetailsController', 50 | controllerAs: 'UserDetails' 51 | }) 52 | ``` 53 | 54 | * [Arquivos](/exercicio02) 55 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio01/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Be MEAN 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |

{{ User.titulo }}

16 | 17 |
18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio01/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bold; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .animate{ 22 | transition: all linear 0.5s; 23 | } 24 | 25 | .ng-hide{ 26 | height: 0; 27 | } 28 | 29 | .item.ng-enter{ 30 | transition: all linear 0.5s; 31 | } 32 | 33 | .item.ng-enter{ 34 | opacity: 0; 35 | } 36 | 37 | .item.ng-enter.ng-enter-active{ 38 | color: #4CAF50; 39 | font-weight: bold; 40 | font-size: 1.2rem; 41 | opacity: 1; 42 | } 43 | 44 | .item.ng-leave{ 45 | transition: all linear 0.5s; 46 | } 47 | 48 | .item.ng-leave{ 49 | opacity: 0; 50 | } 51 | 52 | .item.ng-leave.ng-leave-active{ 53 | opacity: 1; 54 | } 55 | 56 | .item.ng-move{ 57 | transition: all linear 1s; 58 | } 59 | 60 | .item.ng-move{ 61 | opacity: 0; 62 | } 63 | 64 | .item.ng-move.ng-move-active{ 65 | opacity: 1; 66 | } 67 | 68 | .bold{ 69 | font-weight: bold; 70 | } 71 | 72 | .strike{ 73 | text-decoration: line-through; 74 | } 75 | 76 | .ng-valid{ 77 | background-color: #B4E5C4; 78 | } 79 | 80 | .dirty{ 81 | background-color: #ccc; 82 | } 83 | 84 | .invalid{ 85 | background-color: red; 86 | } 87 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio01/views/user-details.html: -------------------------------------------------------------------------------- 1 |

Dados do user

2 | 3 |

Buscar o user pelo id: {{ UserDetails.routeParams.id }}

4 | 5 |
6 |
7 | 8 | 9 | 10 |


11 | 12 | 13 | 14 | 15 |
16 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio01/views/users.html: -------------------------------------------------------------------------------- 1 |

Listagem dos usuários

2 | 3 |
58 | 59 | ``` 60 | 61 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-10/willianlauber/index.html) 62 | -------------------------------------------------------------------------------- /class-11/alexmcoder/class-11-resolved-AlexMCoder-Alex-Morgado-Pereira.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 11 - Exercício 2 | 3 | **user:** [AlexMCoder](https://github.com/AlexMCoder) 4 | 5 | **autor:** Alex Morgado Pereira 6 | 7 | ## Adicionar ordenação no `ng-options`. 8 | 9 | ```html 10 | 13 | ``` 14 | 15 | ## Criar lógica para desabilitar a linha do usuário quando ele está sendo editado. 16 | 17 | ```html 18 |
21 | 22 | 23 | {{ user.name }}{{ user.email }} 29 | 30 |
22 | 23 | 24 | {{ user.name }}{{ user.email }} 30 | 31 |
19 | 20 | 21 | {{ user.email }}{{ user.type }}{{ user.active }} 27 | 28 |
{{ user.name }}
4 | 5 | 6 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 |
7 | 10 |
NameEmail
24 | 25 | 26 | {{ user.name }}{{ user.email }} 32 | 33 |
37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio02/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Be MEAN 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |

{{ User.titulo }}

16 | 17 | - Lista de Users - 18 | 19 |
20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio02/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bold; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .animate{ 22 | transition: all linear 0.5s; 23 | } 24 | 25 | .ng-hide{ 26 | height: 0; 27 | } 28 | 29 | .item.ng-enter{ 30 | transition: all linear 0.5s; 31 | } 32 | 33 | .item.ng-enter{ 34 | opacity: 0; 35 | } 36 | 37 | .item.ng-enter.ng-enter-active{ 38 | color: #4CAF50; 39 | font-weight: bold; 40 | font-size: 1.2rem; 41 | opacity: 1; 42 | } 43 | 44 | .item.ng-leave{ 45 | transition: all linear 0.5s; 46 | } 47 | 48 | .item.ng-leave{ 49 | opacity: 0; 50 | } 51 | 52 | .item.ng-leave.ng-leave-active{ 53 | opacity: 1; 54 | } 55 | 56 | .item.ng-move{ 57 | transition: all linear 1s; 58 | } 59 | 60 | .item.ng-move{ 61 | opacity: 0; 62 | } 63 | 64 | .item.ng-move.ng-move-active{ 65 | opacity: 1; 66 | } 67 | 68 | .bold{ 69 | font-weight: bold; 70 | } 71 | 72 | .strike{ 73 | text-decoration: line-through; 74 | } 75 | 76 | .ng-valid{ 77 | background-color: #B4E5C4; 78 | } 79 | 80 | .dirty{ 81 | background-color: #ccc; 82 | } 83 | 84 | .invalid{ 85 | background-color: red; 86 | } 87 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio02/views/user-details.html: -------------------------------------------------------------------------------- 1 |

Dados do user

2 | 3 |

Buscar o user pelo email: {{ UserDetails.routeParams.email }}

4 | 5 |

6 | Nome: {{ UserDetails.users[UserDetails.routeParams.users.email].name }} 7 | 8 |
9 | 10 | Email: {{ UserDetails.users[UserDetails.routeParams.users.email].email }} 11 |

12 | -------------------------------------------------------------------------------- /class-15/ednilsonamaral/exercicio02/views/users.html: -------------------------------------------------------------------------------- 1 |

Listagem dos usuários

2 | 3 | 4 | 5 | 6 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 |
7 | 10 |
NameEmail
24 | 25 | 26 | {{ user.name }}{{ user.email }} 32 | 33 |
37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/class-16-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 16 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468980942519 5 | 6 | 7 | ## Refatorar o código do *config* para deixar no padrão que utilizamos do John Papa. 8 | 9 | Seguindo o *Style Guide* do John Papa, a `config` deve ser passada como uma `function`. Refatorando, ficou da seguinte da forma: 10 | 11 | `app.js` 12 | ```js 13 | angular.module('BeMEAN', ['ngAnimate', 'ngRoute', 'User']) 14 | .config(config); 15 | 16 | function config($routeProvider, $locationProvider){ 17 | $locationProvider.html5Mode(true); 18 | 19 | $routeProvider 20 | .otherwise({ 21 | redirectTo: '/index' 22 | }) 23 | } 24 | ``` 25 | 26 | `users.js` 27 | ```js 28 | angular.module('User', ['ngAnimate', 'ngRoute']) 29 | .config(config) 30 | .controller('UserController', UserController) 31 | .controller('UserDetailsController', UserDetailsController); 32 | 33 | function config($routeProvider){ 34 | $routeProvider 35 | .when('/users', { 36 | templateUrl: 'views/users-list.html', 37 | controller: 'UserController', 38 | controllerAs: 'User' 39 | }) 40 | .when('/users/:id', { 41 | templateUrl: 'views/user-details.html', 42 | controller: 'UserDetailsController', 43 | controllerAs: 'UserDetails' 44 | }); 45 | } 46 | ``` 47 | 48 | 49 | ## Criar a rota para a **edição** de um usuário, onde mesmo irá ter que clicar em botão na View dos detalhes do usuário onde o levará para: `/users/{{INDEX}}/edit` 50 | 51 | `user.js` (rota) 52 | ```js 53 | .when('/users/:id/edit', { 54 | templateUrl: 'views/user-edit.html', 55 | controller: 'UserController', 56 | controllerAs: 'User' 57 | }); 58 | ``` 59 | 60 | `users-detail.html` 61 | ```html 62 | - Editar esse User - 63 | ``` 64 | 65 | `user-edit.html` 66 | ```html 67 |

Editing User

68 | 69 |
70 | 71 | 72 | 73 |


74 | 75 | 76 | 77 |
78 | ``` 79 | 80 | * [Arquivos](/exercicio) 81 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/assets/css/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bold; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .animate{ 22 | transition: all linear 0.5s; 23 | } 24 | 25 | .ng-hide{ 26 | height: 0; 27 | } 28 | 29 | .item.ng-enter{ 30 | transition: all linear 0.5s; 31 | } 32 | 33 | .item.ng-enter{ 34 | opacity: 0; 35 | } 36 | 37 | .item.ng-enter.ng-enter-active{ 38 | color: #4CAF50; 39 | font-weight: bold; 40 | font-size: 1.2rem; 41 | opacity: 1; 42 | } 43 | 44 | .item.ng-leave{ 45 | transition: all linear 0.5s; 46 | } 47 | 48 | .item.ng-leave{ 49 | opacity: 0; 50 | } 51 | 52 | .item.ng-leave.ng-leave-active{ 53 | opacity: 1; 54 | } 55 | 56 | .item.ng-move{ 57 | transition: all linear 1s; 58 | } 59 | 60 | .item.ng-move{ 61 | opacity: 0; 62 | } 63 | 64 | .item.ng-move.ng-move-active{ 65 | opacity: 1; 66 | } 67 | 68 | .bold{ 69 | font-weight: bold; 70 | } 71 | 72 | .strike{ 73 | text-decoration: line-through; 74 | } 75 | 76 | .ng-valid{ 77 | background-color: #B4E5C4; 78 | } 79 | 80 | .dirty{ 81 | background-color: #ccc; 82 | } 83 | 84 | .invalid{ 85 | background-color: red; 86 | } 87 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/assets/img/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-16/ednilsonamaral/exercicio/assets/img/.keep -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/assets/js/app.js: -------------------------------------------------------------------------------- 1 | angular.module('BeMEAN', ['ngAnimate', 'ngRoute', 'User']) 2 | .config(config); 3 | 4 | function config($routeProvider, $locationProvider){ 5 | $locationProvider.html5Mode(true); 6 | 7 | $routeProvider 8 | .otherwise({ 9 | redirectTo: '/index' 10 | }) 11 | } 12 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Be MEAN 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |

{{ User.titulo }}

17 | 18 | 25 | 26 |
27 |
28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/views/user-details.html: -------------------------------------------------------------------------------- 1 |

Dados do user

2 | 3 |

Buscar o user pelo id: {{ UserDetails.routeParams.id }}

4 | 5 |

6 | Nome: {{ UserDetails.users[UserDetails.routeParams.id].name }} 7 | 8 |
9 | 10 | Email: {{ UserDetails.users[UserDetails.routeParams.id].email }} 11 |

12 | 13 | - Editar esse User - 14 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/views/user-edit.html: -------------------------------------------------------------------------------- 1 |

Editing User

2 | 3 |
4 | 5 | 6 | 7 |


8 | 9 | 10 | 11 |
12 | -------------------------------------------------------------------------------- /class-16/ednilsonamaral/exercicio/views/users-list.html: -------------------------------------------------------------------------------- 1 |

Listagem dos usuários

2 | 3 | 4 | 5 | 6 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 |
7 | 10 |
NameEmail
24 | 25 | 26 | {{ user.name }}{{ user.email }} 32 | 33 |
37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/class-17-resolved-ednilsonamaral-Ednilson-Amaral.md: -------------------------------------------------------------------------------- 1 | # AngularJS 1.5.x - Aula 17 - Exercício 2 | **user:** [ednilsonamaral](https://github.com/ednilsonamaral) 3 | **autor:** Ednilson Amaral 4 | **data:** 1468987301844 5 | 6 | 7 | ## Crie uma rota/view que receba o nome de um usuário do GitHub na URL **users/github/:user** e mostre **pelo menos** 8 atributos, com sua imagem de avatar em uma estrutura visual mais correta. 8 | 9 | `users.js` 10 | ```js 11 | .when('/users/github/:user', { 12 | templateUrl: 'views/users-github.html', 13 | controller: 'UserGitHubController', 14 | controllerAs: 'UserGitHub' 15 | }) 16 | ``` 17 | 18 | `users-github.html` 19 | ```html 20 |

Dados do user

21 | 22 |
23 |
24 |
25 | Avatar do github do {{ UserGitHub.user.name }} 26 | {{ UserGitHub.user.name }} 27 |
28 | 29 |
30 |

Nome: {{ UserGitHub.user.name }}

31 |

Username: {{ UserGitHub.user.login }}

32 |

Usuário desde: {{ UserGitHub.user.created_at }}

33 |

Repositórios Públicos: {{ UserGitHub.user.public_repos }}

34 |

Localização: {{ UserGitHub.user.location }}

35 |
36 | 37 |
38 | Blog 39 | Email 40 |
41 |
42 |
43 | ``` 44 | 45 | ![Print](https://raw.githubusercontent.com/ednilsonamaral/be-mean-instagram-angular1/af6d86d276323a58b5dc430e97b066d117de93c8/img/print_aula_17.png) 46 | 47 | * [Arquivos](/exercicio) 48 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/assets/css/styles.css: -------------------------------------------------------------------------------- 1 | html body select{ 2 | display: inline-block; 3 | } 4 | 5 | [disabled]{ 6 | background-color: #ccc !important; 7 | } 8 | 9 | .wrapper { 10 | max-width: 600px; 11 | margin: 0 auto; 12 | } 13 | 14 | .h1{ 15 | font-size: 30px; 16 | font-weight: bolder; 17 | color: blue; 18 | text-align: center; 19 | } 20 | 21 | .h2{ 22 | font-size: 26px; 23 | font-weight: bold; 24 | color: blue; 25 | text-align: center; 26 | } 27 | 28 | .animate{ 29 | transition: all linear 0.5s; 30 | } 31 | 32 | .ng-hide{ 33 | height: 0; 34 | } 35 | 36 | .item.ng-enter{ 37 | transition: all linear 0.5s; 38 | } 39 | 40 | .item.ng-enter{ 41 | opacity: 0; 42 | } 43 | 44 | .item.ng-enter.ng-enter-active{ 45 | color: #4CAF50; 46 | font-weight: bold; 47 | font-size: 1.2rem; 48 | opacity: 1; 49 | } 50 | 51 | .item.ng-leave{ 52 | transition: all linear 0.5s; 53 | } 54 | 55 | .item.ng-leave{ 56 | opacity: 0; 57 | } 58 | 59 | .item.ng-leave.ng-leave-active{ 60 | opacity: 1; 61 | } 62 | 63 | .item.ng-move{ 64 | transition: all linear 1s; 65 | } 66 | 67 | .item.ng-move{ 68 | opacity: 0; 69 | } 70 | 71 | .item.ng-move.ng-move-active{ 72 | opacity: 1; 73 | } 74 | 75 | .bold{ 76 | font-weight: bold; 77 | } 78 | 79 | .strike{ 80 | text-decoration: line-through; 81 | } 82 | 83 | .ng-valid{ 84 | background-color: #B4E5C4; 85 | } 86 | 87 | .dirty{ 88 | background-color: #ccc; 89 | } 90 | 91 | .invalid{ 92 | background-color: red; 93 | } 94 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/assets/img/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-17/ednilsonamaral/exercicio/assets/img/.keep -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/assets/js/app.js: -------------------------------------------------------------------------------- 1 | angular.module('BeMEAN', ['ngAnimate', 'ngRoute', 'User']) 2 | .config(config); 3 | 4 | function config($routeProvider, $locationProvider) { 5 | $locationProvider.html5Mode(true); 6 | 7 | $routeProvider 8 | .otherwise({ 9 | redirectTo: '/index' 10 | }); 11 | } 12 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Be MEAN 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |

{{ User.titulo }}

17 | 18 | 26 | 27 |
28 |
29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/views/user-details.html: -------------------------------------------------------------------------------- 1 |

Dados do user

2 | 3 |

Buscar o user pelo id: {{ UserDetails.routeParams.id }}

4 | 5 |

6 | Nome: {{ UserDetails.users[UserDetails.routeParams.id].name }} 7 | 8 |
9 | 10 | Email: {{ UserDetails.users[UserDetails.routeParams.id].email }} 11 |

12 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/views/users-github.html: -------------------------------------------------------------------------------- 1 |

Dados do user

2 | 3 |
4 |
5 |
6 | Avatar do github do {{ UserGitHub.user.name }} 7 | {{ UserGitHub.user.name }} 8 |
9 | 10 |
11 |

Nome: {{ UserGitHub.user.name }}

12 |

Username: {{ UserGitHub.user.login }}

13 |

Usuário desde: {{ UserGitHub.user.created_at }}

14 |

Repositórios Públicos: {{ UserGitHub.user.public_repos }}

15 |

Localização: {{ UserGitHub.user.location }}

16 |
17 | 18 |
19 | Blog 20 | Email 21 |
22 |
23 |
24 | -------------------------------------------------------------------------------- /class-17/ednilsonamaral/exercicio/views/users-list.html: -------------------------------------------------------------------------------- 1 |

Listagem dos usuários

2 | 3 | 4 | 5 | 6 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 |
7 | 10 |
NameEmail
24 | 25 | 26 | {{ user.name }}{{ user.email }} 32 | 33 |
37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /class-17/gkal19/assets/css/styles.css: -------------------------------------------------------------------------------- 1 | html body select { 2 | display: inline-block; 3 | } 4 | [disabled] { 5 | background-color: #ccc !important; 6 | } 7 | .wrapper { 8 | max-width: 600px; 9 | margin: 0 auto; 10 | background-color: #fff; 11 | } 12 | .animate { 13 | transition: all linear 0.5s; 14 | } 15 | .ng-hide { 16 | height: 0; 17 | } 18 | .item.ng-enter { 19 | -webkit-transition:all linear 0.5s; 20 | transition:all linear 0.5s; 21 | } 22 | .item.ng-leave { 23 | -webkit-transition:all linear 0.5s; 24 | transition:all linear 0.5s; 25 | } 26 | .item.ng-move { 27 | -webkit-transition:all linear 1s; 28 | transition:all linear 1s; 29 | } 30 | .item.ng-enter { 31 | opacity:0; 32 | } 33 | .item.ng-leave { 34 | opacity:1; 35 | height: 100px; 36 | } 37 | .item.ng-leave.ng-leave-active { 38 | opacity:0; 39 | height: 0; 40 | } 41 | 42 | .item.ng-move { 43 | opacity: 0; 44 | } 45 | .item.ng-move.ng-move-active { 46 | opacity: 1; 47 | } 48 | 49 | .item.ng-enter.ng-enter-active { 50 | font-weight: normal; 51 | opacity:1; 52 | } 53 | .strike { 54 | text-decoration: line-through; 55 | } 56 | .success { 57 | background-color: #A4E567; 58 | } 59 | .danger { 60 | background-color: #E56759; 61 | } 62 | .valid { 63 | background-color: #B4E5C4; 64 | } 65 | .ng-invalid { 66 | background-color: red; 67 | } 68 | .has-error { 69 | color: black; 70 | font-weight: bold; 71 | background-image: url('error.png'); 72 | background-repeat: repeat-y; 73 | } 74 | .selected { 75 | font-weight: lighter; 76 | text-decoration: line-through; 77 | } 78 | input[type=search] { 79 | width: 130px; 80 | box-sizing: border-box; 81 | border: 2px solid #ccc; 82 | border-radius: 4px; 83 | font-size: 16px; 84 | background-color: white; 85 | background-image: url('searchicon.png'); 86 | background-position: 10px 10px; 87 | background-repeat: no-repeat; 88 | padding: 12px 20px 12px 40px; 89 | -webkit-transition: width 0.4s ease-in-out; 90 | transition: width 0.4s ease-in-out; 91 | text-align:center; 92 | } 93 | input[type=search]:focus { 94 | width: 100%; 95 | text-align:center; 96 | } 97 | .tabela { 98 | border-collapse: collapse; 99 | } 100 | .tabela tbody tr:nth-child(even) { 101 | background-color: #CCC; 102 | } 103 | .tabela tbody tr:nth-child(odd) { 104 | background-color: #FFF; 105 | } 106 | fieldset { 107 | border: 0; 108 | } -------------------------------------------------------------------------------- /class-17/gkal19/assets/img/.keep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Webschool-io/be-mean-instagram-angular1-exercises/c5fc39851272a8fea06d0630f302cf99901d3284/class-17/gkal19/assets/img/.keep -------------------------------------------------------------------------------- /class-17/gkal19/assets/js/app.js: -------------------------------------------------------------------------------- 1 | angular.module('BeMEAN', ['ngAnimate', 'ngRoute', 'User']) 2 | .config(config); 3 | 4 | function config($routeProvider, $locationProvider) { 5 | $locationProvider.html5Mode(true); 6 | 7 | $routeProvider 8 | .otherwise({ 9 | redirectTo: '/index' 10 | }); 11 | } 12 | -------------------------------------------------------------------------------- /class-17/gkal19/class-17-resolved-gkal19-Gabriel-Kalani.md: -------------------------------------------------------------------------------- 1 | # AngularJS - Aula 17 - Exercício 2 | 3 | **User:** [gkal19](https://github.com/gkal19) 4 | **Autor:** Gabriel Kalani 5 | **Data** 1469115056274 6 | 7 | ## Crie uma rota/view que receba o nome de um usuário do GitHub na URL **users/github/:user** e mostre **pelo menos** 8 atributos, com sua imagem de avatar em uma estrutura visual mais correta. 8 | ```html 9 | 10 |

Dados do usuário

11 | 12 |
13 |
14 |
15 | Avatar do github do {{ UserGitHub.user.name }} 16 | {{ UserGitHub.user.name }} 17 |
18 | 19 |
20 |

Nome: {{ UserGitHub.user.name }}

21 |

Username: {{ UserGitHub.user.login }}

22 |

Criado: {{ UserGitHub.user.created_at }}

23 |

Repositórios Públicos: {{ UserGitHub.user.public_repos }}

24 |

Localização: {{ UserGitHub.user.location }}

25 |
26 | 27 |
28 | Blog 29 | E-mail 30 |
31 |
32 |
33 | ``` 34 | 35 | > Agora, criamos a rota no `ùsers.js` 36 | 37 | ```js 38 | .when('/users/github/:user', { 39 | templateUrl: 'views/users-github.html', 40 | controller: 'UserGitHubController', 41 | controllerAs: 'UserGitHub' 42 | }) 43 | ``` 44 | 45 | [Arquivo Index.html](https://github.com/webschool-io/be-mean-instagram-angular1-exercises/blob/master/class-17/gkal19/index.html) -------------------------------------------------------------------------------- /class-17/gkal19/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | BeMEAN 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |

{{ User.titulo }}

16 | 17 | 25 | 26 |
27 |
28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /class-17/gkal19/views/user-details.html: -------------------------------------------------------------------------------- 1 |

Dados do user

2 | 3 |

Buscar o user pelo id: {{ UserDetails.routeParams.id }}

4 | 5 |

6 | Nome: {{ UserDetails.users[UserDetails.routeParams.id].name }} 7 | 8 |
9 | 10 | E-mail: {{ UserDetails.users[UserDetails.routeParams.id].email }} 11 |

12 | -------------------------------------------------------------------------------- /class-17/gkal19/views/users-github.html: -------------------------------------------------------------------------------- 1 |

Dados do {{ UserGitHub.user.name }}

2 | 3 |
4 |
5 |
6 | Avatar do github do {{ UserGitHub.user.name }} 7 | {{ UserGitHub.user.name }} 8 |
9 | 10 |
11 |

Nome: {{ UserGitHub.user.name }}

12 |

Username: {{ UserGitHub.user.login }}

13 |

Criado: {{ UserGitHub.user.created_at }}

14 |

Repositórios Públicos: {{ UserGitHub.user.public_repos }}

15 |

Localização: {{ UserGitHub.user.location }}

16 |
17 | 18 |
19 | Blog 20 | E-mail 21 |
22 |
23 |
24 | -------------------------------------------------------------------------------- /class-17/gkal19/views/users-list.html: -------------------------------------------------------------------------------- 1 |

Listagem dos usuários

2 | 3 | 4 | 5 | 6 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 |
7 | 10 |
NameEmail
24 | 25 | 26 | {{ user.name }}{{ user.email }} 32 | 33 |
37 | 38 | 39 | 40 | 41 | --------------------------------------------------------------------------------