Я решил, что если я надавил ng-controller="GeneralInfoCtrl"
на несколько элементов в моей DOM, они разделили бы те же $scope
(или минимальная двусторонняя привязка не работает).
Причина, по которой я хочу сделать это, состоит в том, что у меня разные представления только для чтения с соответствующими модальными диалогами в самых разных частях HTML, и они не имеют общего предка (кроме <body>
и <html>
).
Есть ли способ заставить обоих контроллеров ссылаться на один объект/сделать привязку данных между ними?
Вот код для тех, кто настаивает на разметке, написанной в 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')
...
И мой контроллер:
function GeneralInfoCtrl($scope) {
$scope.client = {
firstName: 'Charlie',
lastName: 'Brown',
birthDate: new Date(2009, 12, 15),
...
}
}