AngularJS에서 모델 간의 올바른 통신 방법은 무엇입니까?

일부 세부 정보가 포함 된 탐색 모듈이 있습니다 (NavigationModel). 내비게이션 파트 (NavigationCtrl)에서 선택할 수있는 모듈 (SubCtrl1, SubCtrl2 ..)이 있습니다. 각 모듈에는 서로 다른 속성을 가진 자체 모델이 있고 일부는 공유되어 있습니다. 선택한 모듈 (SubCtrl1)에서 일부 값 (모델간에 공유되는 속성)을 변경하면 탐색 세부 정보 섹션 (NavigationCtrl)에서 업데이트하려고합니다.AngularJS에서 모델 간의 올바른 통신 방법은 무엇입니까?

어떻게해야할까요?

function NavigationCtrl(){ 
var vm = this; 
vm.NavigationModel = {}; 
vm.NavigationModel.Name = "Test"; 
} 

function SubCtrl1(){ 
var vm = this; 
vm.SubModel= ... 
} 

<input ng-model="subCtrl1.SubModel.Name"></input>

입력 필드에서 값을 변경할 때 해당 값을 NavigationModel에 갖고 싶습니다.

편집 : 난 당신이 모델은 같은 값을 갖고 싶어한다는 사실은 그들이 동일한 모델을해야 의미 다음 질문을 What's the correct way to communicate between controllers in AngularJS?

출처

2015-01-24 cashmere

모듈 또는 모델

는 여기에이 작업을 수행하는 서비스를 사용하는 방법을 보여 plunkr 작업인가? 아마도 모델을 의미 할 것입니다. 당신이 정말로 물어보고 싶은 것은 컨트롤러 간의 통신입니다. 웹상에는 많은 리소스가 있습니다. 적어도이 [SO 질문] (http://stackoverflow.com/questions/11252780/whats-the-correct-way-to-communicate-between-controllers-in- angularjs? rq = 1) –

그것은 모델입니다. 모든 모듈 (Navigation, SubCtrl1, SubCtrl2 ...)마다 다른 모델이 있습니다. SubCtrl1, SubCtrl2에서 모델 값을 변경하면 탐색 모델이 영향을받을 수 있습니다. 버튼을 사용하여 일부 이벤트의 탐색 모델을 업데이트하고 싶지는 않지만 모든 모듈에 하나의 모델 만 있다고 생각합니다. – cashmere

서비스를 사용하는 것이 일반적으로 대부분의 필요를 커버합니다 – charlietfl

를 확인했습니다. 이 모델은 앱의 다른 곳에서 인스턴스화 될 수도 있고 서비스가 될 수도 있습니다.

http://plnkr.co/edit/4U9ALyqMx1M3KLSq6aRI?p=preview

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


app.controller('MainCtrl', function($scope, dataService) { 
    $scope.dataService = dataService; 
    $scope.name = 'World'; 
}); 

app.service('dataService', function() { 
    this.Name = 'test'; 
}); 

app.controller('SubCtrl', function($scope, dataService) { 
    $scope.SubModel = dataService; 
}); 

app.controller('NavigationCtrl', function($scope, dataService) { 
    $scope.NavigationModel = dataService; 
});

그리고 템플릿 :

<body ng-controller="MainCtrl"> 
    data: {{dataService}} 
    <p>Hello {{name}}!</p> 
    <div ng-controller="NavigationCtrl"> 
     {{NavigationModel}} 
     <input ng-model="NavigationModel.Name"> 
    </div> 
    <div ng-controller="SubCtrl"> 
     {{SubModel}} 
     <input ng-model="SubModel.Name"> 
    </div> 
    </body>

출처

2015-01-25 04:30:30

모델에는 공유 속성이 있지만 모델이 다릅니다. 이런 식으로 서비스를 사용하는 것은 나를위한 해결책이 아닙니다. – cashmere

AngularJS에서 모델 간의 올바른 통신 방법은 무엇입니까?

답변

관련 문제