All geek questions in one place

AngularJS with ASP.NET MVC-Confused

Please note: I read a few of these questions on Stack Overflow, but did not get the clear concept I wanted from these answers.

I have a clear idea of ​​why and how to use AngularJS with the ASP.NET Web API. But I'm confused about using AngularJS with ASP.NET MVC!

In the case of AngularJS with ASP.NET web interface:

The Web API method returns data, and AngularJS is called by the web API controller method and captures the data, and then renders the data in the view. This is pretty logical!

In the case of AngularJS with ASP.NET MVC:

The ASP.NET MVC Controller method itself returns a View / View with data. Then what is the use of AngularJS with ASP.NET MVC?

Despite this, if I want to use AngularJS with ASP.NET MVC, then I should return JSON instead of the MVC representation from the ASP.NET MVC controller method.

My questions:

  • Is it logical to return JSON instead of an MVC view from an ASP.NET MVC controller method in order to use AngularJS with ASP.NET MVC? If I do, is there any benefit?
  • What is the use of AngularJS with ASP.NET MVC? Or Where can I use AngularJS with ASP.NET MVC?
+4
source share
4 answers

Is it logical to return JSON instead of MVC representation from ASP.NET MVC controller in order to use AngularJS with ASP.NET MVC? If I do, is there any benefit?

, . ASP.NET Web API - , . ...

AngularJS ASP.NET MVC? AngularJS ASP.NET MVC?

-, MVC? - -? , html . MVC Angular. :

1. , /. MVC.

public class HomeController : Controller
{
    [Authorize] // Authorize the user.
    public ActionResult Index()
    {
        return View();
    }
}

Angular -API, HTML, . . MVC 401.

2. HTML.

, HTML, . Angular, / HTML, . MVC HTML, .

Angular:

<button type="submit" ng-hide="true" />

MVC:

@if(someCondition)
{
    <button type="submit" ng-hide="true" />
}

, - .

MVC Angular. MVC . Angular Web API , .

+6

JSON MVC- ASP.NET MVC AngularJS ASP.NET MVC?? , ?

, ASP.NET Web API - JSON .

AngularJS ASP.NET MVC?? AngularJS ASP.NET MVC??

, , SPA.

, angular. .

, , html-.

, App.currentUser angular, javascript i18n :

@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
@if (User.Identity.IsAuthenticated)
{
    <script type="text/javascript">
        var MyApp = MyApp || {}
        MyApp.currentUser = '@User.Identity.Name.Replace("\\","\\\\")';
    </script>
}
</head>
<body ng-app="my-app">
    <div ng-view>
        <h1>Welcome to MyApp</h1>
        <p>Loading...</p>
    </div>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-i18n/1.5.8/angular-locale_@(Culture.ToLower()).min.js"></script>
    <script type="text/javascript" src="scripts/app.js"></script>
</body>
</html>
+2

MVC , -API ASP.NET.

, , .

API .

, api. , , , api mix .

.net:

  • - ASP.NET
  • ASP.NET MVC (API)
  • ASP.NET CORE

API api . MVC, API // .

. , , , .

0

-, AngularJS + ASP.NET Web API. AngularJS + ASP.NET MVC "" , , , . WebAPI . . AngularJS, Razor.

AngularJS WebAPI . API. , " JSON ?".

PS Here is a good example of how you can start creating an AngularJS + WebAPI application: http://bitoftech.net/2014/06/09/angularjs-token-authentication-using-asp-net-web-api-2-owin- asp-net-identity / . It's about authentication, but you can get an idea.

0
source

Source: https://habr.com/ru/post/1661916/

More articles:


All Articles