AngularJS：在生产中运行时删除开发部分

Question

我正在 Visual Studio 2013 中开发一个 AngularJS 应用程序。我添加了一个带有一些调试功能的自定义 HTML 模板在开发网站时使用表单字段来操纵我的范围：

<div data-ng-include="'App/Development/development.html'"></div>

它固定在左下角，让我在测试网站时更容易快速执行一些操作。

但这应该在我部署我的网站（发布配置）时删除。

有没有人对此有好的解决方案？目前我的应用程序配置和 AngularJS 没有集成，所以无法告诉我的 Angular 应用程序它是运行生产模式。

Answer 1

假设您将 mvc 与 razor 一起使用

创建一个cs文件

public class ConfigManager
{
    public static bool IsDebugMode()
    {
        #if DEBUG
           return true;
        #else
           return false;
        #endif
    }
}

获取值

<script>
  app.value('myValue', @ConfigManager.IsDebugMode());
 <script>

在你的 angular 控制器上

app.controller('ctrl', function($scope, myValue)  {
  //use myValue
      $scope.isTestMode = myValue;
 });

html

<div data-ng-show="isTestMode" data-ng-include="'App/Development/development.html'"></div>

Answer 2

在上面放一个 ng-clock 这样 div 就不会在 angular 加载前显示，放一个 ng-if 这样你就不会加载 ("include") 需要的资源普通用户。让 service/controller 检查主机（window 对象的属性）。如果是本地的，使用 ng-if 显示面板。您还可以让它检查查询字符串。例如，您可以通过将 ?debug=true 附加到 Url 来远程调试。

Answer 3

我的解决方案是只检查主机名，如果localhost我正在显示我的开发栏。

app.controller('development', function ($scope) {
    $scope.debug = document.location.hostname == "localhost";
});

AngularJS：在生产中运行时删除开发部分

AngularJS: Remove development section when running in production

visual-studio

angularjs

AngularJS：在生产中 运行 时删除开发部分

AngularJS: Remove development section when running in production

visual-studio

angularjs

AngularJS：在生产中运行时删除开发部分