컨트롤러간에 변수를 전달하고 같은 페이지에서 ng-repeat를 사용하십시오.

Question

내 문구 중 일부는 특히 각도/js 용어 (컨트롤러, 서비스, 공장 등)와 관련이 없지만 잘하면 여전히 이해할 수 있습니다. 또한이 질문에는 여러 부분이있어 한 줄로 물어보기가 어려웠습니다. newRegistration.html, Registration.js, 및 addressVerification.js :

나는 3 개 파일이 있습니다.

newRegistration.html에는 사용자가 이메일, 전화, 우편 주소 및 기타 사항을 입력하고 "다음"을 클릭하는 양식이 있습니다. 다음을 클릭하면 Registration.js (컨트롤러?)가 트리거됩니다 (?). 다음 코드에서 newRegistration.html

내가 addressVerification.js에서 새로운 데이터로 업데이트 할 ng-repeat입니다.

<div id="dialog-form" title="CHOOSE THE CORRECT ADDRESS"> 
    <ul> 
     <li ng-repeat="for item in [not sure what to put here because of two js files]"> 

     </li> 
    </ul>  
</div> 

Registration.js

상술 한 ng-repeat 포함 된 템플릿의 컨트롤러.

은 맨 위 행은 다음과 같습니다

angular.module('appname') 
    .controller('RegistrationCtrl', function ($scope, $http, cacheStore, countryStates, birthYear, $anchorScroll, errorMessages, addressVerification, UtilsFactory) 

을 그리고 이것은 관련이있을 수 라인 :

addressVerification.verify(user).then(function (userObj) 

addressVerification.js

Smartystreets이 API를 해결하기 위해 사용/우편 주소를 제안 해.

I는 ng-repeat에 newRegistration.html 채우기 위해 (가변 범위 [η] 임) Registration.js이 모듈에서 변수를 전달하는 방법을 알아낼 수 없다.

angular.module('appname').factory('addressVerification', function($q, userIdentity, $http, smartyToken) { 
    "use strict"; 

    return { 
    verify: function(obj) { 
     var deferred = $q.defer(), 
     street2QS = ""; 

    if (obj.address2 || obj.address2 !== "") { 
     street2QS = "&street2=" + encodeURIComponent(obj.address2); 
    } 

$http.jsonp("https://api.smartystreets.com/street-address?street=" + encodeURIComponent(obj.address1) 
    + street2QS 
    + "&city=" + encodeURIComponent(obj.city) 
+ "&state=" + encodeURIComponent(obj.state) 
+ "&zipcode=" + encodeURIComponent(obj.zip) 
+ "&source=website&auth-token="+ smartyToken.get() + "&candidates=5&callback=JSON_CALLBACK") 
.success(function (response) { 
    var metaData, 
    components; 

     if (response && response.length === 1) { 
     metaData = response[0].metadata || {}; 
     components = response[0].components || {}; 

      angular.extend(obj, { 
     "address1": [ 
      components.primary_number, 
     components.street_name, 
     components.street_suffix 
        ].join(" "), 
     "address2": [ 
     components.secondary_designator, 
     components.secondary_number 
     ].join(" "), 
     "city": components.city_name, 
     "county_name": metaData.county_name, 
     "county_fips": metaData.county_fips, 
     "state": components.state_abbreviation, 
     "latitude": metaData.latitude, 
     "longitude": metaData.longitude, 
     "plus4_code": components.plus4_code, 
     "zip": components.zipcode 
     }); 
     deferred.resolve(obj); 
     } else { 
      deferred.reject(false); 
     } 
     }).error(function() { 
      deferred.reject(false); 
     }); 

     return deferred.promise; 
    } 
    }; 
}); 

나는 지금 꽤 우둔 해. 나는 필요한 모든 세부 사항을 부여했다고 생각한다. 나는 어디서부터 시작해야할지 알고 싶다. 지연 객체, ng-repeat 및 컨트롤러에 대해 모두 읽었지만 혼란 스럽습니다.

도움을 주시면 감사하겠습니다.

Answer 1

당신은 RegistrationCtrl에 addressVerification을 삽입하고 있습니다.

angular.module('appname') 
.factory('addressVerification', function($q, userIdentity, $http, smartyToken) 

따라서 당신이 RegistrationCtrl에서 addressVerification.js 파일의 내부에서 무슨 일이 일어나고 물건에 액세스 할 수 있습니다 다음 RegistrationCtrl에 주입 addressVerification의 가치는 여기에서 정의하고있는 함수를 실행에 의해 반환되는 값입니다. js 파일을 반환합니다.

데이터를 RegistrationCtrl에 넣으면 데이터를 RegistrationCtrl 내부의 범위에 추가하여보기에서 데이터에 액세스 할 수 있습니다. 예 :

이 RegistrationCtrl.js에 갈 것 :

$scope.someItems = [1, 2, 3, 4]; 

이보기에 갈 것 :

<li ng-repeat="item in someItems">{{item}}</li> 

Answer 2

나는이 공장의 노출 방법입니다 구현 한 방법이 동일한 팩토리 내에 값을 저장하는 컨트롤러 (및 컨트롤러의 뷰)를 허용하십시오.

예를 들어, 다음 코드에서 current 값은 customers 공장 출하시 저장됩니다. 팩토리는 싱글 톤이기 때문에 응용 프로그램에서 지속됩니다. 사용자가 <a> (다음 예에서)을 클릭하고 href="/"으로 이동 한 후에도 동일한 공장이 두 컨트롤러의 종속성 인 경우 customers.current에 저장된 값은 "/"경로의 컨트롤러에서 액세스 할 수 있습니다. 응답에 대한

템플릿

<ul> 
    <li>{{customers.current.name}}</li> 
    <li 
     ng-repeat="customer in customers.all" 
     > 
     <a 
      class="action name" 
      ng-click="customers.setCurrent(customer)" 
      href="/" 
      > 
      {{customer.name}} 
     </a> 
    </li> 
</ul> 

컨트롤러

angular 
.module('CtrlCustomerList', [ 
    'CollectionCustomers', 
]) 
.controller('CtrlCustomerList', function($scope, CollectionCustomers) { 
    $scope.customers = CollectionCustomers; 
}); 

공장

angular 
.module('CollectionCustomers', [ 
]) 
.factory("CollectionCustomers", function(Restangular, ModelCustomer, $location) { 
    return { 
     all  : [], 
     current : null, 
     setCurrent : function() { 
      // Affect this.current 
     } 
    } 
});