Wie bekomme ich den Wert von einem Controller zu einem anderen Controller und rufe den JSON mit angularJS

Ich versuche, eine App mit HTML und AngularJS zu bauen.Wie bekomme ich den Wert von einem Controller zu einem anderen Controller und rufe den JSON mit angularJS

Die Anforderung besteht darin, zwei Autocomplete-Textfelder zu haben, um die Stadt und den Namen zu erhalten.

Ich bin in der Lage, diese beiden zu bekommen. nicht das Problem für mich ist. Ich bin nicht in der Lage, die Namen basierend auf der ausgewählten Stadt zu erhalten (wenn keine Stadt ausgewählt ist: zeigen Sie die Namen aus allen Städten & & wenn Stadt ausgewählt ist zeigen die Namen nur aus der Stadt)

Hier ist mein Code:

<!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>

Dies ist die JS-Datei

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

     }]);

mir bitte sagen, wie die Stadt Wert zu übergeben zusammen mit dem doctor_name im zweiten Controller während der params zum json Aufruf übergeben.

Quelle

2017-01-18 HARISH

Haben Sie einige Werte von "autocompleteController" Controller übergeben wollen "areaLocationController" Controller? – kamlesh

schnelle Frage, warum brauchen Sie zwei Controller? – debuggerpk

Ja, ich muss einen Wert in der AreaLocationController an die AutocompleteController übergeben. Bin neu in diesem AngularJS, wenn es möglich ist in einem einzelnen Controller oder einem anderen Format zu arbeiten, bitte das Beispiel – HARISH

Bitte folgende Änderungen vornehmen und sehen, ob es funktioniert:

Inject 'myservice' in 'areaLocationController' und es zu einem 'myservice' lokale Variablen zuweisen.
Entfernen Sie die Abhängigkeit '$ scope' von Abhängigkeitsinjektion/Annotationsarray von 'autocompleteController', Annotationsarray sollte immer mit den Parametern in der Funktionsdeklaration übereinstimmen. Hier

ist der Code mit den Änderungen:

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

    } 
]);

Quelle

2017-01-18 12:02:49 Manishz90

können Sie mir den vollen Code mit Änderungen am aktuellen Code mitteilen – HARISH

Wie bekomme ich den Wert von einem Controller zu einem anderen Controller und rufe den JSON mit angularJS

Antwort

Verwandte Themen