Javascript 指令/工厂未在生产中工作

我有一个为用户打印flash消息的指令。在我的本地主机上一切正常，但只要我在Heroku上测试它，flash消息就不会出现。这是控制器

angular.module("alerts")

.controller("AlertsController", alertController)

alertController.$inject = ['Flash']

function alertController(Flash) {
  var vm = this;

  vm.flash = Flash;
}

指令

angular.module("alerts")

.directive('flash', flash);

flash.$inject = ['$timeout'];

function flash ($timeout){
  return {
     restrict: 'E',
     replace: true,
     scope: {
         text: '=',
         type: '='
     },
     template: '<div id="flash_message" class="notification" ng-class="type"> {{text}} hello </div>',
     link: function(scope, element, attrs){
         $timeout(function(){
             element.remove();
         }, 5000);
     }
  }
}

我的html代码

<div ng-controller="AlertsController as alerts">
  <div ng-repeat="message in alerts.flash.messages">
    <flash type="message.type" text="message.text"></flash>
  </div>
</div>

---

我的问题是，为什么这不会出现在我的生产代码上，但它会出现在我的本地主机上？我如何修复它？

重命名我的文件名和指令中的内部函数解决了问题。

当然，重命名文件名一定解决了您的问题。但问题是，为什么它早些时候在localhost上工作？我认为在localhost上，所有javascript文件都会立即加载，相应工厂和指令的函数“flash”都已正确注册

但在heroku或任何其他远程服务器上运行时，您会遇到问题，因为控制器或指令可能会注册不同于它们必须注册的“闪存”功能

一个合理的原因可能是angularjs的库文件（来自您的服务器或cdn）加载到DOM中的时间比controller.js、service.js或directive.js等文件稍晚。这就是DOM在开始时无法识别.controller（）或.service（）等的角度语法的原因。因此，您的一个全局“闪存”功能（指令或工厂）被覆盖

首先，我建议您重命名，您已经这样做了，其次，不要在指令或工厂中使用全局函数

---

我希望这可以解释。

您是否正在缩小javascript？您正在哪个浏览器上检查控制台的错误？一些浏览器显示一些错误，而其他浏览器只显示警告或无警告。试试Firefox、Chrome、IE、Opera。此外，您知道您的服务器是否正在缓存输出吗？因为这些是静态文件，所以很可能会发生缓存。确保你下载的是最新的或缓存的文件。有人能解释一下他们为什么投了否决票吗？我觉得这是一个有足够适当信息的有效问题。我不知道如何进一步澄清这个问题。它可以在本地主机上运行，但在heroku上不会显示任何flash消息。我已经记录了出现在本地和生产之间的html代码。我还需要显示哪些其他调试？控制台除了告诉我代码被执行的事实外，没有告诉我任何事情。上面的每一段代码都被包装在一个单独的生命中吗？如果没有，则有两个

函数flash（）

对象，一个用于指令，一个用于工厂。如果它们只是在单独的文件中，但没有被包装成

（function（）{[…]}）（

，那么它们都将在全局范围内，并且可能会引起问题。

<div ng-controller="AlertsController as alerts">
  <div ng-repeat="message in alerts.flash.messages">
    <flash type="message.type" text="message.text"></flash>
  </div>
</div>

<div ng-repeat="message in alerts.flash.messages" class="ng-scope">
  <div id="flash_message" class="notification ng-binding ng-isolate-scope success" ng-class="type" type="message.type" text="message.text"> Your link has been copied! hello </div>
</div>

<div ng-repeat="message in alerts.flash.messages" class="ng-scope"></div>

Flash.addMessage({type: "success", text: "Your link has been copied!"});