在 Asp.net MVC 5 应用程序中将 AngularJS 升级到 Angular 6答案

【问题标题】：Upgrading AngularJS to Angular 6 in Asp.net MVC 5 application在 Asp.net MVC 5 应用程序中将 AngularJS 升级到 Angular 6
【发布时间】：2018-11-15 02:34:14
【问题描述】：

我有一个现有的带有 AngularJS 的 asp.net MVC 5 应用程序，我想在不重写整个应用程序的情况下将 AngularJS 升级到 Angular 6。我读了official guide，但它并没有真正帮助我。这是一个小例子：

我有一个这样的视图，其中包含另一个包含角度指令的动态视图：

<div id="container" ng-controller="MyController">
     @Html.Action("MyView", "Home")
</div>

控制器：

angular.module('myApp').controller('MyController', ['$scope', function($scope) {
        $scope.doSomething= function () {
             //do stuff
        }            
    }
]);

将此类控制器转换为 Angular 组件的最佳实践是什么？对我来说最困难的部分是组件必须使用在服务器上生成的模板。

我找到的最接近的答案是How to render asp.net mvc view into angular 2?，但看起来它在 Angular 6 中不起作用，我不确定这是要走的路。

请指教。

【问题讨论】：

首先，Angular 2+ 没有 $scope。控制器操纵this 对象。

标签： asp.net asp.net-mvc angular

【解决方案1】：

我认为你必须重写整个应用程序。优点是您已经设计了应用程序，因此您只需要编码/构建它。从 AngularJS 转换到 Angular6 没有安全的方法。

【讨论】：

【解决方案2】：

Angular 已从 AngularJS（或 Angular 1）完全重写为 Angular 2 以及所有后续版本。 Bert Verhees 的回答是正确的——您需要再次重写 Angular 代码，因为 Angular 2 引入了对原始 AngularJS 构建的代码破坏性更改。

Here's an article that covers some of the changes

快速摘录：

AngularJS

AngularJS 的架构基于模型-视图-控制器 (MVC) 设计。模型是表达应用程序行为并管理其数据、逻辑和规则的中心组件。视图根据模型中的信息生成输出。控制器接受输入，将其转换为命令并将命令发送到模型和视图。

角度

在 Angular 2 中，控制器和 $scope 被组件和指令所取代。组件是带有模板的指令。它们处理页面上的应用程序和逻辑的视图。 Angular 2 中有两种指令。它们是通过删除和替换元素来改变 DOM 布局的结构指令，以及改变 DOM 元素的行为或外观的属性指令。

【讨论】：