Question

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

要求使用两个自动填充文本框来获取城市和名称。

能够得到这两者。不是我的问题。无法根据所选城市获取名称（如果没有选择城市：显示所有城市的名称＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;＆amp;

这是我的代码：

    <!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;
              })
            }

        }]);

请告诉我如何将城市价值与第二个控制器中的doctor_name一起传递，同时将参数传递给json电话。

Answer 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;
        });
    };

  }
]);

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

1 个答案: