Question

我对以下内容感到困惑。当我从https://www.firebase.com/tutorial/#session/xa9242ucksy复制以下教程时：

<html ng-app="myApp">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script>
    <script src="https://cdn.firebase.com/js/client/1.1.1/firebase.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/0.8.0/angularfire.min.js"></script>
    <link rel='stylesheet' href='/resources/tutorial/css/example.css'/>
  </head>

  <body ng-controller="MyController">

    <!-- CHAT MARKUP -->
    <div class='example-chat l-demo-container'>
      <header>Firebase Chat Demo</header>

      <div class='example-chat-toolbar'>
        <label for='nameInput'>Username:</label>
        <input ng-model='name' type='text' id='nameInput' placeholder='enter a username...'>
      </div>

      <ul id='example-messages' class='example-chat-messages'>
        <li ng-repeat='msg in messages'>
          <strong class='example-chat-username'>{{msg.from}}</strong>
          {{msg.body}}
        </li>
      </ul>

      <footer>
        <input ng-model='msg' ng-keydown="addMessage($event)" type='text' id='messageInput'  placeholder='Type a message...'>
      </footer>
    </div>

    <script>
      var myApp = angular.module("myApp", ["firebase"]);

      myApp.controller('MyController', ['$scope', '$firebase',
        function($scope, $firebase) {
          //CREATE A FIREBASE REFERENCE
          var ref = new Firebase("https://xa9242ucksy.firebaseio-demo.com/");

          // GET MESSAGES AS AN ARRAY
          $scope.messages = $firebase(ref).$asArray();

          //ADD MESSAGE METHOD
          $scope.addMessage = function(e) {

            //LISTEN FOR RETURN KEY
            if (e.keyCode === 13 && $scope.msg) {
              //ALLOW CUSTOM OR ANONYMOUS USER NAMES
              var name = $scope.name || 'anonymous';

              //ADD TO FIREBASE
              $scope.messages.$add({
                from: name,
                body: $scope.msg
              });

              //RESET MESSAGE
              $scope.msg = "";
            }
          }
        }
      ]);
    </script>
  </body>
</html>

而不是将索引页面中的脚本，但我删除该部分，将其复制到名为app.js的文件并保存，然后它不再工作???基本上在头部我添加：

<head>
    // OTHER
    <script src="js/app.js"></script>
  </head>

修改当我尝试以下时，它确实有效。但同样，首先参考的问题是什么？我想将它存储在JS文件夹中。

<head>
        // OTHER
        <script src="app.js"></script>
      </head>

编辑2： 似乎问题是我存储了多个.js文件。所以问题在angularJS上变得越来越多。基本上我有多个文件，因为我想拆分我的控制器，所以当我在index.html文件的末尾有以下内容时：

不工作

<script src="js/maps.js"></script>
<script src="js/app.js"></script>
<script src="js/controller-fb.js"></script>
<script src="js/controller-maps.js"></script>

工作

<script src="js/app.js"></script>

我的其他文件与app.js类似

Answer 1

JavaScript将始终在页面中找到它时进行解析。对于您编写的脚本，它将在解析时运行。

将它放在HTML的<head>部分中意味着在运行它时不存在任何DOM。

将<script src="app.js"></script>放在与顶部示例中的<script>相同的位置，它将像以前一样工作。

当脚本在index.html之外时，为什么控制器不起作用？

1 个答案: