angular-bootstrap-2

In this example, we will see the sum of two values val1 and val2 and display the result without using ng-app directive. See the code snippet:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome in the AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
</head>
<body>
    <div ng-controller="bootstrapController">
        <form ng-submit="add()">
            <input type="number" ng-model="val1" />
            <input type="number" ng-model="val2" /><br />
            Sum: {{sum}}<br />
            <button>Save</button>
        </form>
    </div>
</body>
</html>
<script>
    var app = angular.module("app", []);
    app.controller('bootstrapController', ['$scope', function ($scope) {
        $scope.add = function () {
            $scope.sum = $scope.val1 + $scope.val2;
        }
    }]);
    angular.bootstrap(document, ['app']);
   
</script>

Output