2016-01-18 4 views
0

У меня возникли проблемы с получением простого вложенного представления для отображения моих данных. Я пытаюсь перейти к нему.Угловое множественное представление, не получающее данные

Родительский вид загружает вложенные ... Обратите внимание, что если я делаю {{opc.org.address}} до этого, он проливает данные.

<div ui-view="address" addressData="opc.org.address"></div> 

Шаблон адрес ... Примечание, если я изменяю {{opc.org.address. (Любой)}} Я могу увидеть штраф данных.

<div class="addressWrapper" ui-view> 
<span class="address">{{ addressData.address1 }}</span><br /> 
<span class="address2" ng-if="addressData.address2">{{ addressData.address2 }}<br />></span> 
<span class="city">{{ addressData.city}}</span>, 
<span class="state">{{ addressData.state}}</span>&nbsp; 
<span class="zip">{{ addressData.postalCode}}</span> 
<span class="country" ng-if="addressData.countryCode"><br />{{ addressData.countryCode }}</span> 

Мы бежим сайт через машинопись и Ui-маршрутизатор. Вот часть файла маршрутизатора, который загружает родительский и адресный вид.

.state('search.orgProfile', { 
     url: '/orgs/:externalOrgId', 
     views: { 
      '': { 
       templateUrl: 'app/orgs/org-profile.tmpl.html', 
       controller: 'OrgProfileController', 
       controllerAs: 'opc', 
       resolve: { 
        org: function (orgProfileService: IOrgProfileService, $stateParams: any) { 
         return orgProfileService.getOrgProfile(<string>$stateParams.externalOrgId) 
          .then(function (orgDetails: IOrg) { 
           return orgDetails; 
          }); 
        }, 
        relationships: function (relationshipsService: IRelationshipsService, org: IOrg) { 
         return relationshipsService.getRelationships(org.id, 0, Constants.PAGE_SIZE) 
          .then(function (relationships: RelationshipModel[]) { 
           return relationships; 
          }); 
        }, 
        notes: function (notesService: INotesService, org: IOrg) { 
         return notesService.getNotes(Constants.NOTES_TYPE_ORG, org.id) 
          .then(function (theNotes: NoteModel[]) { 
           return theNotes; 
          }); 
        } 
       } 
      }, 
      '[email protected]': { 
       templateUrl: 'app/components/address/address.tmpl.html' 
      } 
     } 
    }); 

При запуске страницы я вижу только «,». Таким образом, он работает как угловой, но не видит адрес, который я передал. Я что-то пропустил? Нужно ли определять адресные данные где-то еще?

ответ

0

Решение заключалось в том, чтобы добавить контроллер в вложенное представление и установить адресData на адрес orgs, который был разрешен в основном представлении. Взял немного разворота, чтобы найти его, но как только я подключил его, все было хорошо!

  '[email protected]': { 
       templateUrl: 'app/components/address/address.tmpl.html', 
       controller: function ($scope: any) { 
        $scope.addressData = $scope.$parent.$parent.opc.org.address; 
       } 
      } 
0

Область наследуется между наследуемыми состояниями/видами.

Вы должны иметь возможность использовать {{opc.org.address}} в шаблоне вашего представления и $ scope.opc в вашем контроллере представлений. Он будет искать родительскую область. Просто имейте в виду, чтобы инициализировать ваши поля в родительской области. Например, если вы не установили значение null до выполнения асинхронной загрузки, но сделайте это в контроллере вашего представления. У вас будет 2 различных объекта opc.

https://github.com/angular-ui/ui-router/wiki/multiple-named-views

Там нет ничего предположить, вы можете передать параметры зрения, но я не думаю, что вам нужно.

Поскольку представление является внутренним для состояния, просто используйте область родителя.

EDIT: После комментария: я предлагаю использовать директиву для представления addressData в общем виде и иметь возможность привязывать их к области. Представления относятся к разной части состояния/либо представляют собой совершенно разные данные (например: заголовки/контенты/нижние колонтитулы), либо они используются для представления некоторых данных, унаследованных от области. Поэтому они сильно привязаны к состоянию родителя (если есть), и вы не можете их отделить. Если вам нужно отделить что-то и связать его с другим состоянием/областью, для этой директивы.

+0

Да, использование opc.org.address в шаблоне адреса работает, но мне нужно использовать этот шаблон для более чем одного представления, используя разные контроллеры. Поэтому мне нужен шаблон, чтобы получить данные адреса, переданные от родителя. – NikZ

+0

Может быть, лучше вопрос, как бы я установил scope.addressData в u-route? – NikZ

+0

То, что я говорю, вам не нужно. Но если вы действительно хотите сделать: $ scope.addressData = $ scope.opc.org.address в вашем OrgProfileController. Если вы хотите разделить привязки между представлением и состоянием, попробуйте добавить функцию addressData: function ($ scope) {return $ scope.opc.org.address}, которая вы вводите ее в контроллер контроллера вида. вам просто нужно было изменить решение каждый раз, когда вы используете этот шаблон/ctronller в другом состоянии. – Walfrat