angularjs application in visual studio 2019

Updated : Nov 29, 2019 in Articles

Setup angularjs application in visual studio 2019

In this article, we will learn how to Setup angularjs application environment in visual studio 2019 in a simple way

open visual studio create angularjs project name like “angularJsApp”

next window you will select an empty project and then click on ok button

Right-click on your project select Manage NuGet packages

browse the angularjs.core and install

Once installed the angularjs you will have js file in a script folder

Angularjs setup done, we will test by using one sample example you will create a directory structure for angularJs application follow the given below image

App.js

var app = angular.module('myapp', []);

Testcontroller.Js

app.controller('TestController', function ($scope) {
 $scope.testmessage = "Setup angularjs application in visual studio 2019 successfully ";
});

test.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>AngularJs Sample</title>
    <script src="Scripts/angular.js"></script>
    <script src="Controllers/App.js"></script>
    <script src="Controllers/TestController.js"></script>
</head>
<body ng-app="myapp">
    <div ng-controller="TestController">
        <h2>{{testmessage}}</h2>
    </div>
</body>
</html>

OutPut: