다른 구성 요소에서 구성 요소에 액세스

Question

Angularjs 1.5를 사용하여 다른 구성 요소를 사용하는 페이지의 한 구성 요소 디스플레이에 정의 된 D3.js 그래프를 만드는 데 문제가 있습니다. 저는 Angular를 처음 접했고 그 대답은 the official documentation's example of a component tree에 묻혀 있다고 생각하지만 논리를 완전히 따라갈 수는 없었습니다.

내 목표는 graphController에서 정의 된 그래프를 만들고 requests.template.html에 의해 액세스 된 것으로 나타나도록 만드는 것입니다.

내가 지시 나에게 내가 다른 사람으로부터 설정을 상속 (그리고 보호 구조에게 그것이 길을 떠나 선호)

알 수없는 공급자 오류를 준 것처럼 requests.component에 주입하려고하고, 이런 식으로 어느 정도 외모 :

requests.module.js 
angular.module("requests", []); 

requests.component.js 
angular.module('requests').component('requests', { 
    templateURL: 'Bindings/Templates/requests.html', 
    controller: function requestsController($scope) { 
     [code] 
    } 
} 

requests.template.html 
//where I'd like to be able to access the controller from the graphs component 

graphs.module.js 
angular.module('graphs', []); 

graphs.component.js 
angular.module('graphs').component('graphs', { 
    templateURL: '/Bindings/Templates/graphs.template.html', 
    controller: function graph() {(code for d3 graph)}; 
} 

graphs.template.js 
{{$ctrl.graph()}} 
//this page is just a placeholder to see the graph until I can view it on requests' page 

당신이 제공하거나 내가 좋은 것를 통해이 컨트롤러 호출을 스레드하는 방법에 대해 생각하는 방식으로 할 수있는 모든 도움이됩니다. 감사!

Answer 1

요청 구성 요소에 그래프를 표시하려면 요청 템플릿에 구성 요소 요소 태그를 삽입하면됩니다. 예를 들어, 바인딩/템플릿/requests.html 삽입에 : 당신이 구성 요소를 만든 후에

<div class="stuff-to-wrap-graph"> 
    <graphs></graphs> 
</div> 

, 당신은 다른 구성 요소 내에 포함 어디서나 삽입 할 수있는 고유 HTML 요소처럼 생각합니다. 일반적으로 부모의 밀접하게 결합 된 자식 인 경우에만 다른 구성 요소의 컨트롤러에 직접 액세스 할 수 있습니다. 상위 탭 컨테이너와 통신해야하는 탭 구성 요소 내의 개별 탭.