AngularJS - 从.NET控制器生成视图只执行一次

Question

我有一个带有 AngularJS 的 MVC .NET 应用程序。在我的路由提供程序中，我使用 mvc 的控制器来检索视图，如下所示：

   .when('/Units', {
        templateUrl: 'Unit/Units'
    })
    .when('/UnitsDetail', {
        templateUrl: 'Unit/UnitsDetail'
    })

而我的 .NET UnitController 有以下方法：

 [Authorize]
    public ActionResult Units()
    {
        return View();
    }

    [Authorize]
    public ActionResult UnitsDetail()
    {
        ViewBag.reference = Guid.NewGuid().ToString().Substring(0, 6);
        return View();
    }

对于 UnitsDetail 视图，我需要在 UnitsDetail() 方法中生成的引用。

当我多次从 Units 转到 UnitsDetail 时，问题就出现了。第一次调用 UnitsDetail() 方法并因此生成引用，但如果我返回 Units 并再次访问 UnitsDetail，则不会调用该方法并且引用是相同的。我需要每次生成一个引用。

我知道我可以在客户端使用 JS 生成它，或者从 Angular 向服务器发出 AJAX 请求，但我真正想知道的是如何让 Angular 在每次我转到“#/”时调用方法 UnitsDetail()单位详情”。

谢谢！

Answer 1

默认情况下，Angular 会将所有视图缓存在其模板缓存中。

这是设计使然。

Angular 期望视图只是静态 HTML，动态部分使用 {{ dynamicScopeVariable }} 代码标记。 Angular 将使用范围对象来替换动态位。但是静态部分会从缓存中显示出来。

第一次执行视图时，视图被缓存。

这里有 2 个选项。实际上，从您的设计角度来看，这只是一个很好的 #2。

选项#1

在 Angular 中禁用模板缓存，如下所示 https://stackoverflow.com/a/27432167/2794980

这意味着 Angular 每次需要视图时都会调用 HTML ACTION。

这不是使用 angualar 的最佳方式，但它会起作用。您还应该考虑性能方面。到目前为止，ASP.NET MVC 应用程序上最耗时的调用是 Actions 调用。这种方法意味着，当您使用客户端 MVC 框架时，您并没有利用它的重要优点之一。

选项 #2

使用角度服务从后端获取 GUID。即下面的代码。

 ViewBag.reference = Guid.NewGuid().ToString().Substring(0, 6);

如果可以的话，最好使用 WebAPI（您的请求会很小）。使用 Angular 替换 VIEW 中的 GUID。

不清楚为什么需要 GUID 以及是否可以使用 Javascript 生成随机唯一编号的问题。如果这是可能的，它可能是最好的解决方案。但根据问题中的信息，您可以使用选项 1 或 2。

编辑：没有意识到您已经尝试过选项 2，在这种情况下是选项 1。

编辑2：如果你想从缓存中删除单个元素，你可以这样做

 $templateCache.remove("<Element Name>");

或者你可以使用

$cacheFactory.remove("Name")

在此处阅读有关缓存工厂的更多信息： https://docs.angularjs.org/api/ng/service/$cacheFactory

名称一般为页面名称，可以在调试器控制台查看模板缓存或缓存工厂对象找到准确的名称。