한 컨트롤러에서 다른 컨트롤러로 스코프를 바인딩하는 방법은 무엇입니까?

저는 두 곳에서 사용하는 컨트롤러가 있습니다 : ng-view와 ng-include. 이 장소는 자식 또는 부모가 아니지만 ng-include에 대한 ng-view 영향의 일부 변경 사항도 원합니다. 어떻게해야합니까?한 컨트롤러에서 다른 컨트롤러로 스코프를 바인딩하는 방법은 무엇입니까?

여기 코드 부분에는 plunker입니다.

"사용자 편집"을 클릭하면 팝업의 표에서 user.userName이 (가) 클릭됩니다. index.html을

<body> 
    <div ng-view></div> 
    <div ng-include="'edit-user.html'"></div> 

    <script src="app.js"></script> 
    <script src="UsersController.js"></script> 
    </body>

는

var app = angular.module('myApp', ['ngRoute', 'ui.materialize']) 
    .config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 
     $routeProvider 
      .when('/', { 
       templateUrl: 'users.html', 
       controller: 'UsersController' 
      }) 
      .otherwise({redirectTo: '/'}); 
    }]);

users.html

<h4>Users</h4> 
<table class="striped highlight"> 
    <thead> 
     <tr> 
      <th data-field="displayName">Display Name</th> 
      <th data-field="userName">User Name</th> 
      <th data-field="registered">Registered</th> 
      <th data-field="updated">Updated</th> 
      <th data-field="email">Email</th> 
      <th data-field="authority">Authority</th> 
      <th data-field="edit">Edit</th> 
     </tr> 
    </thead> 

    <tbody> 
     <tr ng-repeat="user in users"> 
      <td ng-bind="user.displayName"></td> 
      <td ng-bind="user.userName"></td> 
      <td ng-bind="user.registered"></td> 
      <td ng-bind="user.updated"></td> 
      <td ng-bind="user.email"></td> 
      <td ng-bind="user.authority"></td> 
      <td><a class="collection-item waves-effect waves-teal" modal open="openModal" ng-click="openModalFunc(user)">Edit user</a></td> 
     </tr> 
    </tbody> 
</table> 
<a data-target="edit-user" class="hide" modal open="openModal">Edit user</a>

UsersController.js을 app.js

app.controller('UsersController', ['$scope', function($scope) { 
    // create fake users 
    $scope.users = [ 
     { 
      displayName: 'Alexander', 
      registered: '02-07-2017', 
      updated: '02-07-2017', 
      email: '[email protected]', 
      authority: 'admin', 
      userName: 'Alex' 
     }, 
     { 
      displayName: 'Lev', 
      registered: '02-07-2017', 
      updated: '02-07-2017', 
      email: '[email protected]', 
      authority: 'guest', 
      userName: 'Lev' 
     } 
    ] 

    $scope.openModal = false; 

    $scope.openModalFunc = function(user) { 
     $scope.openModal = true; 
     $scope.selectedUser = user; 
     Materialize.toast('Awesome, we did it!', 4000); 
    } 
}]);

편집 - user.html

<div id="edit-user" class="modal col l3" ng-controller="UsersController"> 
    <div class="modal-content"> 
     <h4>{{selectedUser.userName}}</h4> 
    </div> 
    <div class="modal-footer"> 
     <a class="modal-action modal-close waves-effect waves-green btn-flat">Agree</a> 
    </div> 
</div>

출처

2017-02-10 through.a.haze

@lin 질문을 업데이트했습니다. –

그 다음은 하나의 컨트롤러에서 $broadcast을 사용하고 $on .. 을 사용하면 좀 더 자세한 정보 here를 찾을 수 있습니다 잡을 수있는 매우 큰 응용 프로그램이없는 경우.

출처

2017-02-10 15:55:33

한 컨트롤러에서 다른 컨트롤러로 스코프를 바인딩하는 방법은 무엇입니까?

답변

관련 문제