I figured if I slapped ng-controller="GeneralInfoCtrl" on multiple elements in my DOM they would share the same $scope (or least two-way binding isn't working).
The reason I want to do this is because I have different read-only views with associated modal dialogs in very different parts of the HTML and they don't share a common ancestor (aside from <body> and <html>).
Is there a way to make both controllers refer to the same object/make data binding work between them?
Here's some code for those who insist on seeing markup, written in Jade:
.client-box(ng-controller="GeneralInfoCtrl")
.box-header
.box-title
h5 General Information
.box-buttons
button.btn.btn-small(data-target='#editGeneralInfo', data-toggle='modal', data-backdrop='static') <i class="icon-pencil"></i> Edit
.box-body
table.table.table-tight.table-key-value
tr
th Name
td {{client.fullName()}}
tr
th Also Known As
td {{client.aka}}
tr
th Birth Date
td {{client.birthDate|date:'mediumDate'}}
...
#editGeneralInfo.modal.hide.fade(ng-controller="GeneralInfoCtrl")
.modal-header
button.close(type='button', data-dismiss='modal') ×
h3 Edit General Information
.modal-body
form.form-horizontal.form-condensed
.control-group
label.control-label First Name
.controls
input(type='text', placeholder='First Name', ng-model='client.firstName')
.control-group
label.control-label Last Name
.controls
input(type='text', placeholder='Last Name', ng-model='client.lastName')
.control-group
label.control-label Also Known As
.controls
input(type='text', placeholder='AKA', ng-model='client.aka')
.control-group
label.control-label Birth Date
.controls
input(type='text', placeholder='MM/DD/YYYY', ng-model='client.birthDate')
...
And my controller:
function GeneralInfoCtrl($scope) {
$scope.client = {
firstName: 'Charlie',
lastName: 'Brown',
birthDate: new Date(2009, 12, 15),
...
}
}
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
