Você está aqui: AngularJS ::: Angular / AngularJS + JavaScript ::: Diretivas AngularJS |
Tutorial AngularJS - Como usar a diretiva ng-init do AngularJSQuantidade de visualizações: 2481 vezes |
A diretiva ng-init do AngularJS é usada quando queremos criar uma varíável no escopo atual e inicializá-la com algum valor. Veja um exemplo de seu uso:----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<div ng-app="" ng-init="codigo=350">
<h1>O próximo código é: {{codigo + 1}}</h1>
</div>
Quando você executar este exemplo, verá escrita a saída: O próximo código é: 351 Isso aconteceu porque usamos a diretiva ng-init para criar uma variável chamada "codigo" e definimos o seu valor inicial como 350. Então, dentro do elemento <h1>, nós acessamos a variável e aumentamos o seu valor em 1 antes de exibí-la. É importante observar que esta diretiva só é usada em situações nas quais queremos apenas fazer protótipos, exemplos ou testar alguma funcionalidade. Na prática, variáveis do escopo são inicializadas usando-se Components ou Controllers. Um outro uso da diretiva ng-init é para declarar e inicializar variáveis dentro do escopo de um ng-repeat. Veja: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<script type="text/javascript">
// vamos criar uma nova aplicação AngularJS
var app = angular.module('MinhaApp', []);
// vamos criar um novo controller
app.controller('MeuController', function($scope){
$scope.Livros = [
{titulo: "Java para a web", autor: "Osmar J. Silva"},
{titulo: "Aprenda AngularJS", autor: "José de Angelis"}
];
});
</script>
<div ng-app="MinhaApp" ng-controller="MeuController">
<div ng-repeat="livro in Livros" ng-init="ordem = ($index + 1)">
<h1>Ordem: {{ordem}} - Título: {{livro.titulo}} - Autor: {{livro.autor}}</h1>
</div>
</div>
Quando você abrir esta página, verá a seguinte saída: ---------------------------------------------------------------------- Se precisar de ajuda com o código abaixo, pode me chamar no WhatsApp +55 (62) 98553-6711 (Osmar) ---------------------------------------------------------------------- Ordem: 1 - Título: Java para a web - Autor: Osmar J. Silva Ordem: 2 - Título: Aprenda AngularJS - Autor: José de Angelis |
 Link para compartilhar na Internet ou com seus amigos: |
Veja mais Dicas e truques de AngularJS |
Dicas e truques de outras linguagens |
|
C# - Como testar se uma string é null ou vazia em C# usando a função IsNullOrEmpty() da classe String |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
|
1º lugar: Java |
