Angularjs onLoad vs ng-ini – Angularjs Difference between onLoad and ng-init

Angularjs onLoad vs ng-ini – Angularjs Difference between onLoad and ng-init

In this post we will show you onLoad vs ng-ini – Angularjs Difference between onLoad and ng-init. hear we will show you difference between onLoad and ng-init(Angularjs onLoad vs ng-ini).

ng-init :: ng-init should use for only aliasing, ng-init SHOULD NOT be used for any initialization.

onload :: onload should be used if any expression needs to be evaluated after a partial view is loaded (by ng-include).

Angularjs onLoad vs ng-ini :: The major AND most important difference between onLoad and ng-init is when used with ng-include.

In this following case, itsolutionstuck_function is called everytime the partial view is loaded(Angularjs onLoad vs ng-ini).

[php]

[/php]

Whereas, in this following case, itsolutionstuck_function is called only once when the parent view is loaded.
[php]

[/php]

The ng-init operate as shown in over code wont work as is. The operate outlined in ng-int ought to be within the angular context. over focusOnInput() is not within the angular context . It’s in javascript context.

if we wish to use ng-init we will need to inject $window into over controller then use assign focusOnInput to over $scope and use that methodology in ng-init.

ng-init could be a directive that may be placed within div, span, other(html tags), whereas onload is an attribute specific to the ng-include directive that functions as an ng-init. to envision what I mean attempt one thing like:

See also :  Angular Global Variable - How to Declare Global Variable in Angular 9/8?

[php]

{{ itsolutionstuckA }}
{{ itsolutionstuckB }}

[/php]

Example of onload : Angularjs page load

<body onload="itsolutionstuckfocusOnInput()">
   <form name="passwordResetForm">
	  <input name="UserNewPassword" type="password"/>
   </form>
</body>
<script>
   function itsolutionstuckfocusOnInput() {
	  document.forms["passwordResetForm"]["UserNewPassword"].focus();
   }
</script>

Example of ng-init : page load

<body in-init="itsolutionstuckfocusOnInput()">
   <form name="passwordResetForm">
	  <input name="UserNewPassword" type="password"/>
   </form>
   <script>
	  function itsolutionstuckfocusOnInput() {
		 document.forms["passwordResetForm"]["UserNewPassword"].focus();
	  }
   </script>
</body>

we will see that only the second shows up for Angularjs onLoad vs ng-ini.

An isolated scope could be a scope that doesn’t prototypically inherit from its parent scope.

In laymen’s terms if you’ve got a gismo that does not got to scan and write to the parent scope arbitrarily then you utilize an isolate scope on the gismo in order that the gismo and gismo instrumentation will freely use their scopes while not predominant every other’s properties.

Leave a Comment