如何从一个控制器获取值到另一个控制器并使用 angularJS 调用 json答案

【问题标题】：how to get the value from one controller to another controller and call the json using angularJS如何从一个控制器获取值到另一个控制器并使用 angularJS 调用 json
【发布时间】：2017-06-02 17:48:23
【问题描述】：

我正在尝试使用 HTML 和 angularJS 构建一个应用程序。

要求有两个自动完成文本框来获取城市和名称。

我能够同时获得这两个。对我来说不是问题。无法根据所选城市获取名称（如果未选择城市：显示所有城市的名称 && 如果选择了城市，则仅显示该城市的名称）

这是我的代码：

    <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>



    <script src="https://code.angularjs.org/1.5.0/angular.js"></script>
    <script src="https://code.angularjs.org/1.5.0/angular-aria.js"></script>
    <script src="https://code.angularjs.org/1.5.0/angular-animate.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.1/angular-material.min.js"></script>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.1/angular-material.min.css" />
    <link rel="stylesheet" href="style.css" />

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

    <title>Insert title here</title>


</head>

<body ng-app='myapp' layout="column" ng-controller="areaLocationController as ctrl" >

  <div class="col-md-3"  ng-controller="areaLocationController as ctrl" >
    <md-autocomplete flex
            md-selected-item="ctrl.selectedItem"
            md-search-text="ctrl.searchText"
            md-items="item in ctrl.querySearch(ctrl.searchText)"
            md-item-text="item.label"
            md-delay="300"
            md-floating-label="Area/City/Zip Code">
          <div layout="row" class="item" layout-align="start center">
            <!-- <img ng-src="{{item.avatar_url}}" class="avatar" /> -->
            &nbsp;&nbsp;
            <span md-highlight-text="ctrl.searchText">{{item.label}}</span> 
             <input type="hidden" ng-model="myservice.city"  name="label" id="label" value="{{item.label}}"/>

          </div>
          </md-autocomplete>
         </div> 
      <div class="col-md-3"  ng-controller="autocompleteController as ctrl1" >
        <md-autocomplete flex
                md-selected-item="ctrl1.selectedItem"
                md-search-text="ctrl1.searchAreaText"
                md-items="itemArea in ctrl1.queryAreaSearch(ctrl1.searchAreaText)"
                md-item-text="itemArea.label"
                md-delay="300"
                md-floating-label="Doctor/Speciality/Care Provider">
              <div layout="row" class="item" layout-align="start center">

                <span md-highlight-text="ctrl1.searchAreaText">{{itemArea.label}}</span>  
                <input type="hidden" ng-model="DocLabel"  name="DocLabel" id="DocLabel" value="{{itemArea.label}}"/>
                <input type="hidden" ng-model="doctorId" name="doctorId" id="doctorId" value="{{itemArea.doctorId}}"/>
                <input type="hidden" ng-model="specializationId" name="specializationId" id="specializationId" value="{{itemArea.specializationId}}"/ >
              </div>
              </md-autocomplete>
        </div>



  </body>
</html>

这是JS文件

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


       app.service('myservice', function() {

                  this.city="";
          });
       app.controller("areaLocationController", function($http){

            this.querySearch = function(query){
            return $http.get("http://localhost:8080/iHelix2015/getLocationListMobile", {params: {q: query}})
            .then(function(response){
              return response.data.result;
            })
          }
        });
        app.controller("autocompleteController", ['$rootScope', '$scope', '$http','myservice',
                        function($rootScope,  myservice,$http){  
          this.queryAreaSearch = function(Area){
          this.myservice = myservice;
              /*alert(Area);*/
            var cityValue=myservice.city;

              return $http.get("http://localhost:8080/iHelix2015/getDocSearchListForAppMobile", {params: {searchDoc: Area,city:cityValue}})
              .then(function(response){
                return response.data.result;
              })
            }

        }]);

请告诉我如何在第二个控制器中将城市值与医生姓名一起传递，同时将参数传递给 json 调用。

【问题讨论】：

你想将一些值从“autocompleteController”控制器传递给“areaLocationController”控制器吗？
快速提问，为什么需要两个控制器？
是的，我需要将 areaLocationController 中的值传递给 autocompleteController。我是这个 AngularJS 的新手，如果它可以在单个控制器或任何其他格式中类似地工作，请告诉示例
Creating common controller functions的可能重复

标签： angularjs

【解决方案1】：

请进行以下更改，看看是否有效：

在“areaLocationController”中注入“myservice”并将其分配给局部变量“myservice”。
从“autocompleteController”的依赖注入/注释数组中移除依赖“$scope”，注释数组应始终与函数声明中的参数同步。

以下是修改后的代码：

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

app.service('myservice', function() {
  this.city = "";
});

app.controller("areaLocationController", ['$http', 'myService',
  function($http, myService) {
    this.myService = myService.city;
    this.querySearch = function(query) {
      return $http.get("http://localhost:8080/iHelix2015/getLocationListMobile", {
          params: {
            q: query
          }
        })
        .then(function(response) {
          return response.data.result;
        });
    };
  }
]);

app.controller("autocompleteController", ['$rootScope', '$http', 'myservice',
  function($rootScope, myservice, $http) {
    this.queryAreaSearch = function(Area) {
      this.myservice = myservice;
      /*alert(Area);*/
      var cityValue = myservice.city;

      return $http.get("http://localhost:8080/iHelix2015/getDocSearchListForAppMobile", {
          params: {
            searchDoc: Area,
            city: cityValue
          }
        })
        .then(function(response) {
          return response.data.result;
        });
    };

  }
]);

【讨论】：

你能告诉我修改当前代码的完整代码吗