How to use Multiple ng-App in a single Page

Total Post:341

 908  View(s)
Rate this:
We want to use  to use Multiple ng-App  in a single Page. How to do this please help me.
  1. Post:280

    Re: How to use Multiple ng-App in a single Page

    js file:

        Layout = null;
    <!DOCTYPE html>
        <meta name="viewport" content="width=device-width" />
        <script src="~/Scripts/jquery-1.9.1.js"></script>
        <script src="~/Scripts/angular.js"></script>
        <div id="App1" ng-app="shoppingCart" ng-controller="ShoppingCartController">
            <h1>Your order</h1>
                        <th>Product Name</th>
                <tbody ng-repeat="item in items">
                        <td>{{item.price | currency}}</td>
                            <button ng-click="remove($index);">Remove</button>
        <div id="App2" ng-app="namesList" ng-controller="NamesController">
            <h1>Customer Details</h1>
           Name: <input id="name" type="text" ng-model="Name" />
            <br />
          Email:  <input id="email" type="text" ng-model="Email" />
            <br />
           Contact:  <input id="contact" type="text" ng-model="mobile_no" />
            var shoppingCartModule = angular.module("shoppingCart", [])
            shoppingCartModule.controller("ShoppingCartController", function ($scope) {
                $scope.items = [
                          product_name: "HP Pavilion 15-ab216TX Notebook",
                          price: 48500
                          product_name: "HP 15-AC116TX Laptop",
                          price: 36299
                          product_name: "HP 15-AC119TX Laptop",
                          price: 39799
                          product_name: "HP 15-ac118tu Notebook",
                          price: 18999
                           product_name: "HP 15-AF114AU Notebook",
                           price: 25489
                $scope.remove = function (index) {
                    $scope.items.splice(index, 1);
            var namesModule = angular.module("namesList", [])
            namesModule.controller("NamesController", function ($scope) {
                $scope.Name = "Aditya Kumar";
                $scope.Email = "";
                $scope.mobile_no = "8953249451";
            angular.bootstrap(document.getElementById("App2"), ['namesList']);


      Modified On Apr-11-2018 01:42:20 AM



Enter your email address here always to be updated. We promise not to spam!