Pular para o conteúdo principal

Angular JS: Executando comando após documento carregado

Olá.
Hoje trago uma breve dica de como executar alguma instrução javascript após o documento/página estar carregado no browser.

Quando você tem um cenário onde está trabalhando com uma unica página ou no escopo root de sua aplicação você pode utilizar angular.element(document).ready como no exemplo a seguir:



(function() {
    'use strict';

    angular
        .module('Module')
        .controller('ControllerController', ControllerController);

    function ControllerController() {
        var vm = this;

        angular.element(document).ready(function() {
            activate();
        });

        function activate() {
            console.log("activate");
        }
    }
})();


Caso você tenha um cenário com rotas, será necessário que o conteúdo seja renderizado por ng-view para posteriormente rodar seu código. Neste caso angular.element(document).ready não deverá funcionar. Sendo assim necessário uso alguma outra alternativa como a seguinte:



(function() {
    'use strict';

    angular
        .module('Module')
        .controller('ControllerController', ControllerController);

    ControllerController.$inject = ['$scope'];

    function ControllerController($scope) {
        var vm = this;

        $scope.$on('$viewContentLoaded', function() {
            activate();
        });

        function activate() {
            console.log("activate");
        }
    }
})();

Espero que ajude.
Até a próxima ;)

Comentários

Postagens mais visitadas deste blog

Como criar componente dropdown com checkbox ASP.NET MVC

Neste post irei demonstrar a criação de um componente  dropdown com checkbox para selecionar as opções desejadas. Para começar podemos criar uma classe estática para criar o componente que será utilizado numa página razor. public static class Extensions { public static MvcHtmlString DropdownCheckbox( this HtmlHelper helper, string placeholder, IEnumerable<SelectListItem> selectList, object htmlAttributes) { string items = "" ; string rodape = "" ; if (htmlAttributes == null ) { htmlAttributes = new { }; } var attributes = new ExpandoObject() as IDictionary< string , Object>; foreach (PropertyInfo property in htmlAttributes.GetType().GetProperties()) { attributes.Add(property.Name, property.GetValue(htmlAttributes)); } string idDropdown = "dr...

Dica: Extensão Indentar código VUE Visual Studio Code

Olá Por muitas é necessário um atalho para formatar o seu código fonte no editor de texto. Para formatação de HTML, CSS, JS e afins no visual studio code você pode utilizar o: HTML Snippets Mas esta extensão acima não formata arquivos de template .vue . Para formatar este tipo de arquivos é necessário instalar alguma outra extensão. Entre as que busquei a que faz o serviço da melhor forma atualmente utilizando o atalho alt+shift+f   é o plugin ventur: Vetur Este plugin é muito bom mesmo. Facilitou bastante a formatação de fontes em templates .vue. É isso espero que ajude;)

Migrando repositório TFS para GIT

Chega o momento em que decidimos migrar do TFS para GIT por 'N' motivos e benefícios que esta migração pode trazer. Caso você tenha uma repositório de longa data e queira manter o histórico de checkins, o  git-tfs auxilia nesta tarefa. Uma das minhas formas preferidas para instalar é através do chocolatey . Com o chocolatey instalado em sua máquina basta abrir o powershell em modo admin e digitar: cinst GitTfs No powershell para clonar o repositório TFS para seu repositório git você deve digitar o seguinte comando: git tfs clone http : //meutfs.com $/diretoriotfs c : /diretorio-alvo-clone --branches=all -u=CORP\Usuario -p=****** Para mais opções de comando segue link do github do projeto.