Tag Archives: module

React Native Module Bridge Example

By | April 15, 2018

The document demonstrates the steps to create react native module bridge in Android and iOS. Below are the steps for creating a native bridge in Android. ANDROID Open the Android Studio with the corresponding project from your react native project. Step 1 : Create the Java class that extends ReactPackage. (eg: AndroidModulePackage.java). Implement the interface methods (createViewManagers &… Read More »

ng-repeat Simple Demo in Angular JS with filter

By | September 15, 2017

ng-repeat. Example [html] <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <head> <title>Angular JS NG-Repeat Directive</title> <style> table { border-collapse: collapse; } table, td, th { border: 1px solid black; padding: 5px; } </style> <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <script> var app = angular.module("MyModule", []); app.controller("MyController", function($scope){ $scope.title = "Records"; var employees… Read More »

HTML events in Angular JS

By | August 25, 2017

You can add AngularJS event listeners to your HTML elements by using one or more of these directives: ng-blur ng-change ng-click ng-copy ng-cut ng-dblclick ng-focus ng-keydown ng-keypress ng-keyup ng-mousedown ng-mouseenter ng-mouseleave ng-mousemove ng-mouseover ng-mouseup ng-paste Example [html] < !DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> </head><head> <title>Angular JS Controller</title> <script… Read More »

What is Scope and RootScope in Angular JS? with examples

By | August 10, 2017

Scope Scope is the binding part between the HTML (UI) and the Javascript (the Controller). Scope object contains the available properties and methods. Scope is accessible in both HTML and Javascript. Scope Example [html] <div ng-app="myApp" ng-controller="myCtrl"> <h1>{{ name }}</h1> </div> <script> var app = angular.module(‘myApp’, []); app.controller(‘myCtrl’, function($scope) { $scope.name = "Coderz Heaven"; }); </script> [/html] Root… Read More »

How to bind variables in Angular JS using ng-bind?

By | August 5, 2017

You can use the ng-bind directive, which will bind the innerHTML of the element to the specified model property: Method 1 [html] <p ng-bind="demo_var"></p> [/html] Method 2 [html] <p>First name: {{firstname}}</p> [/html] Complete Example [html] <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> <body> <div ng-app="myApp" ng-controller="myCtrl"> <p ng-bind="firstName"></p> <p>{{ lastName }}</p> </div> <script> var app = angular.module(‘myApp’, []); app.controller(‘myCtrl’, function($scope)… Read More »

What is ng-model in Angular JS and How to use it?

By | August 1, 2017

With the ng-model directive you can bind the value of an input field to a variable created in AngularJS. Here we will have two input fields which will bind to two variables in Angular JS. Example [html] <html"> <head> <title>Angular JS Controller</title> <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> </head> <body> <h2>AngularJS Demo Application</h2> <div ng-app="MyApp" ng-controller="MyController" ng-init="test()"> Enter first name:… Read More »