×

Html & Html5

Component of Html

HTML Advance

HTML Advance

Html Form

Html5 basics

Html5 Grid

Html5 Graphics

Html5 Media

Html5 APIs

it training classes Logo

The World's best Software Development Study Portal

AngularJS & Angular

Introduction to AngularJS

AngularJS Tutorial

AngularJS Includes


  • we can include HTML from an external file using the ng-include

  • The HTML files you include with the ng-include directive, can also contain AngularJS code.

  • By default, the ng-include directive does not allow you to include files from other domains.

  • To include files from another domain, you can add a whitelist of legal files and/or domains in the config function of your application.




    • With AngularJS, you can include HTML content using the ng-include directive:

    
   <body ng-app="">
    

   <div ng-include ="'myFile.htm'"></div>
    

   </body>


    Include the file "myTable.htm" in your web page

    
    <div ng-app="myApp" ng-controller="customersCtrl">>
    <div ng-include="'myTable.htm'"></div>
    </div>
    <script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function($scope, $http) {
    $http.get("customers.php").then(function (response) {
    $scope.names = response.data.records;
    });
    });
    </script>


    Include Cross Domains

    
    <body ng-app="myApp">
    <div ng-include="'https://tryit.w3schools.com/angular_include.php'"> </div>
    <script>
    var app = angular.module('myApp', [])
    app.config(function($sceDelegateProvider) {
    $sceDelegateProvider.resourceUrlWhitelist([
    'https://tryit.w3schools.com/**'
     ]);
    });
    </script>
    </body>