Javascript 无法使用相同的角度文件获取第二控制器的范围_Javascript_Angularjs

Javascript 无法使用相同的角度文件获取第二控制器的范围

javascript angularjs

Javascript 无法使用相同的角度文件获取第二控制器的范围,javascript,angularjs,Javascript,Angularjs,我的主页使用了两个控制器。 1.用于处理搜索自动完成的控制器（用于建议位置的谷歌地图api）。 2.另一个控制器来处理页面的其余部分但是第二个控制器的作用域没有显示出来 EJS: <head> <title><%= title %></title> <link rel="stylesheet" href="/bootstrap/bootstrap.min.css"> <script src="bootst

我的主页使用了两个控制器。
1.用于处理搜索自动完成的控制器（用于建议位置的谷歌地图api）。
2.另一个控制器来处理页面的其余部分

但是第二个控制器的作用域没有显示出来

EJS:

<head>
    <title><%= title %></title>
    <link rel="stylesheet" href="/bootstrap/bootstrap.min.css">
    <script src="bootstrap/jquery.min.js"></script>
    <script src="bootstrap/bootstrap.min.js"></script>
    <script src="angular/angular.min.js"></script>
    <script src="angular/locationController.js"></script>
    <script src="angular/mainController.js"></script>
    <link rel='stylesheet' href='/stylesheets/style.css' />

    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />

    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
    </script>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA67uROXPqm2Nnfg5HOTHttn2C7QRn1zIo&libraries=places&sensor=false"></script>

    <script src="ngAutocomplete/script.js"></script>
    <script src="ngAutocomplete/ngAutoComplete.js"></script>
  </head>



            <li class="ul_One"  ng-controller="searchBarController">

                    <div id="inLine" class="col-lg-12 ul_Two" style="">
                        <input type="text" class="form-control ul_Three" id="Autocomplete" placeholder="Where to?" ng-autocomplete="result1" details="details1" options="options1" ng-model="destination">
                    </div>

            </li>

            <li class="ul_One"  ng-controller="testController">

                    <div id="inLine" class="col-lg-12 ul_Two" style="">
                        <input type="text" class="form-control ul_Three" id="Autocomplete" placeholder="Where to?" ng-autocomplete="result1" details="details1" options="options1" ng-model="destination">
                    </div>

            </li>

mainController.js:

var app = angular.module('myApp', []);

//home page main controller  //home page main controller  
//home page main controller  //home page main controller  
app.controller('searchBarController', function($scope, $http) {


    $scope.test = "Hello";
    console.log("$scope.test ", $scope.test);

});
//home page main controller  //home page main controller  
//home page main controller  //home page main controller

var app = angular.module('myApp', []);

//home page main controller  //home page main controller  
//home page main controller  //home page main controller  
app.controller('testController', function($scope, $http) {


    $scope.test = "Hello";
    console.log("$scope.test ", $scope.test);

});
//home page main controller  //home page main controller  
//home page main controller  //home page main controller

您已经在每个控制器文件中创建了两次角度模块。我在一个文件中创建了一个模块，并将其分配给

window.app

，然后在第二个文件中使用相同的模块

相反，您可以在第二个文件中调用

angular.module（'myApp'）

，而不使用第二个参数，该参数将返回在第一个文件中创建的模块

//文件1:locationController.js
（功能（）{
var-app=angular.module（'myApp'，[]）；
window.app=app；
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
app.controller（'searchBarController'，函数（$scope，$http）{
$scope.destination=“Hello”；
//log（$scope.test，$scope.test）；
});
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
})();
//文件2:mainController.js:
（功能（）{
var-app=window.app；
//也可以如下所示：，
//var-app=angular.module（'myApp'）；
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
app.controller（'testController'，函数（$scope，$http）{
$scope.destination=“Hello”；
//log（$scope.test，$scope.test）；
});
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
})();
引导（文档，['myApp']）




您已经在每个控制器文件中创建了两次角度模块。我在一个文件中创建了一个模块，并将其分配给window.app
，然后在第二个文件中使用相同的模块
相反，您可以在第二个文件中调用angular.module（'myApp'）
，而不使用第二个参数，该参数将返回在第一个文件中创建的模块

//文件1:locationController.js
（功能（）{
var-app=angular.module（'myApp'，[]）；
window.app=app；
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
app.controller（'searchBarController'，函数（$scope，$http）{
$scope.destination=“Hello”；
//log（$scope.test，$scope.test）；
});
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
})();
//文件2:mainController.js:
（功能（）{
var-app=window.app；
//也可以如下所示：，
//var-app=angular.module（'myApp'）；
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
app.controller（'testController'，函数（$scope，$http）{
$scope.destination=“Hello”；
//log（$scope.test，$scope.test）；
});
//主页主控制器//主页主控制器
//主页主控制器//主页主控制器
})();
引导（文档，['myApp']）




我已将您的代码发送到两个控制器
看看那是什么

同样在您的代码和javascript引用中，抛出了一个异常SensorNotRequired，可以在本文中进一步探讨。
我通过删除url中的传感器查询字符串修复了它
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA67uROXPqm2Nnfg5HOTHttn2C7QRn1zIo&libraries=places">

</script>



为了显示它的工作情况，我可能已经在HTML中添加了一个标签。。
看一眼
 我已将您的代码发送到两个控制器
看看那是什么

同样在您的代码和javascript引用中，抛出了一个异常SensorNotRequired，可以在本文中进一步探讨。
我通过删除url中的传感器查询字符串修复了它
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA67uROXPqm2Nnfg5HOTHttn2C7QRn1zIo&libraries=places">

</script>



为了显示它的工作情况，我可能已经在HTML中添加了一个标签。。
看一眼
 您不需要两次定义应用程序模块。每次将空数组传递给模块时，它都会尝试创建一个新数组。您应该只有一个以[]作为第二个参数的应用程序模块。大多数情况下，Angular是对开发人员友好的。您的控制台为您说明了错误。在创建模块两次时，请检查控制台是否存在任何错误。创建一个模块并将其分配给“window.app=app”，然后在第二个控制器中使用相同的模块作为“var app=window.app”@Sreekanth，即使我仅使用一个模块定义将两个控制器写入同一文件，同样的问题仍然存在。第二个控制器上没有显示你所说的范围的确切含义？@jack你在模板中调用了myApp吗？你不需要定义两次应用程序模块。每次将空数组传递给模块时，它都会尝试创建一个新数组。您应该只有一个以[]作为第二个参数的应用程序模块。大多数情况下，Angular是对开发人员友好的。您的控制台为您说明了错误。在创建模块两次时，请检查控制台是否存在任何错误。创建一个模块并将其分配给“window.app=app”，然后在第二个控制器中使用该模块作为