JIYIK CN >

Current Location:Home > Learning > WEB FRONT-END > Angular >

Calling the load function in Angular

Author:JIYIK Last Updated:2025/04/18 Views:

We will introduce a function when the page is loaded in Angular.


Loading in Angular

When we want to execute a function when a page or component is loaded, we initcall that function on .

Let's start with an example. First, we will create a view.

# angular
<body>
  <div ng-app="newapp" ng-controller="newcontroller" data-ng-init="init()">
    <h2>Page Loaded</h2>
  </div>
</body>

ng-appWe defined our , ng-controller, initialized componentand in the code above data-ng-init.

Now, let's write a function that will display output on the console when the page loads.

# angular
var app = angular.module("newapp", []);
app.controller("newcontroller", function($scope){
  $scope.init = function(){
    console.log("Page Loaded")
  }
})

Output:

angular on load function result

The example we gave shows how easy it is to call a function when the page loads. We can easily call any function using the above example.

For reprinting, please send an email to 1244347461@qq.com for approval. After obtaining the author's consent, kindly include the source as a link.

Article URL:

Related Articles

Enabling HTML5 mode in AngularJS

Publish Date:2025/04/18 Views:148 Category:Angular

This article will guide you through enabling HTML5 mode with deep linking on your AngularJS application. Using HTML5 mode in AngularJS $locationProvider.html5Mode pushState is a way to tell the browser that it needs to use HTML5 mode for UR

Loading spinner in AngularJs

Publish Date:2025/04/18 Views:133 Category:Angular

We will cover how to add a loading spinner while the request is loading and stop the loader while data is loading in AngularJs. Loading spinner in AngularJs Loaders are a part of web applications to make them user-friendly and improve the u

Showing and hiding in Angular

Publish Date:2025/04/18 Views:91 Category:Angular

We will walk through examples of showing and hiding components or elements in Angular. Showing and hiding in Angular While developing business applications we need to hide some data based on user roles or conditions. We have to display the

Downloading files in Angular

Publish Date:2025/04/18 Views:164 Category:Angular

We will look at how to download a file in Angular by clicking a button and show an example. File downloading in Angular Downloading files in Angular is very easy. We can use HTML5 download attributes to download files. # angular a href = "F

Drag and drop in Angular

Publish Date:2025/04/18 Views:187 Category:Angular

We will introduce @angular/cdk/drag-drop the module to accomplish drag and drop in angular. We will also walk through some examples of drag and drop in Angular. Drag and drop in Angular @angular/cdk/drag-drop The module provides you with a

Use TypeScript's getElementById replacement in Angular

Publish Date:2025/04/18 Views:196 Category:Angular

This tutorial guide provides a brief description of replacing AngularJS with TypeScript document.getElementById . This also provides getElementById the best practices for using in Angular with code examples. We will also see the use of DOM

Using ngSwitch in Angular

Publish Date:2025/04/18 Views:194 Category:Angular

In common programming languages, you have heard and used switch the statement at least once. Statements are used to execute blocks of code when there are many if pre statements , we convert these pre statements into pre statements to save t

Adding classes in Angular

Publish Date:2025/04/18 Views:139 Category:Angular

We will cover different methods like className and ngClass to add static or dynamic classes in Angular. We will also cover how to toggle classes in Angular. Adding static or dynamic classes in Angular Classes are the main part of any web ap

Scan to Read All Tech Tutorials

Social Media
  • https://www.github.com/onmpw
  • qq:1244347461

Recommended

Tags

Scan the Code
Easier Access Tutorial