Tutorial - Chamando uma função no controller via evento onchange
Neste tutorial vamos chamar uma função no controller Angular via um evento onchange.

Abra o editor de texto de sua preferência e crie um arquivo HTML com o nome angtut11.html e defina o código abaixo:

Eu estou usando o VS Code: (Visual Studio Code - Apresentando o editor multiplataforma da Microsoft )

<!doctype html>
<html >
<head>
     <meta charset="UTF-8">
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
</head><!-- macoratti.net-->
<body ng-app="macApp">
  <div ng-controller="MacCtrl">
     <img ng-src="http://www.macoratti.net/maco1b.jpg" alt="http://www.macoratti.net" />
	 <h3> Angular -  Exemplos práticos </h3>
	 <hr>
	 Selecione o arquivo :
    <input type="file"  onchange="angular.element(this).scope().setArquivo(this)">
    {{Arquivo.name}}
</div>
<script type='text/javascript'>
var macApp = angular.module('macApp', []);
  macApp.controller('MacCtrl', function($scope) {
      $scope.setArquivo = function(element) {
          $scope.$apply(function($scope) {
               $scope.Arquivo = element.files[0];
        });
    };
});
</script>
</body>
</html>
 Estou usando a distribuição CDN do Angular.

diretivas usadas:

ng-app - define a aplicação angular macApp

ng-controller - define o controlador macCtrl

ng-src - carrega a imagem no endereço : http://www.macoratti.net/maco1b.jpg

{{Arquivo.name}} - exibe o nome do arquivo selecionado

$scope.$apply - toma uma função como parâmetro a qual é executada e os data-bindings atualizados.

Clique no link para ver a aplicação angular funcionando : angtut11.html

(Disse Jesus aos fariseus) Hipócritas, bem profetizou Isaías a vosso respeito, dizendo:
Este povo se aproxima de mim com a sua boca e me honra com os seus lábios, mas o seu coração está longe de mim.
Mas, em vão me adoram, ensinando doutrinas que são preceitos dos homens.
Mateus 15:7-9

Veja os Destaques e novidades do SUPER DVD Visual Basic (sempre atualizado) : clique e confira !

Quer migrar para o VB .NET ?

Quer aprender C# ??

Quer aprender os conceitos da Programação Orientada a objetos ?

Quer aprender o gerar relatórios com o ReportViewer no VS 2013 ?

Quer aprender a criar aplicações Web Dinâmicas usando a ASP .NET MVC 5 ?

 

  Gostou ?   Compartilhe no Facebook   Compartilhe no Twitter

 

Referências:

José Carlos Macoratti