У меня есть простая приложение для jhipster и сгенерированы 2 объекта: Product
и Category
как показано here. Генератор создает страницы для отображения Product
и Category
данных соответственно.Объединить 2 угловых страницы в приложении Jhipster
Теперь, скажем, я хочу создать новую страницу, которые объединяют эти 2 страницы в одной странице:
<div>
<jhi-alert></jhi-alert>
<div class="container-fluid">
<uib-tabset>
<uib-tab index="0" heading="Category">
<div>Categories Goes Here..</div>
</uib-tab>
<uib-tab index="1" heading="Product">
<div>Products Goes Here..</div>
</uib-tab>
</uib-tabset>
</div>
</div>
(function() {
'use strict';
angular
.module('hipsterappApp')
.config(stateConfig);
stateConfig.$inject = ['$stateProvider'];
function stateConfig($stateProvider) {
$stateProvider
.state('combined/product-and-category', {
parent: 'entity',
url: '/combined/product-and-category',
data: {
authorities: ['ROLE_USER'],
pageTitle: 'Combined Product and Category'
},
views: {
'[email protected]': {
templateUrl: 'app/entities/combined/combined.html',
controller: 'CombinedController',
controllerAs: 'vm'
}
}
});
}
})();
Мои вопросы, как я повторно использовать страницы из products.html и categories.html, чтобы он мог быть включен в comb.html?
Я пытался использовать ng-include
как:
<div ng-include src="'app/entities/category/categories.html'"></div>
страница включена, но данные не отображаются. Есть идеи?
Спасибо.
EDIT 1:
Я изменил combined.html иметь UI-представление следующим образом:
<uib-tab index="0" heading="Category">
<div ui-view="category"></div>
</uib-tab>
<uib-tab index="1" heading="Product">
<div ui-view="product"></div>
</uib-tab>
И изменить combined.state.js, а также:
.state('combined', {
parent: 'entity',
url: '/combined/product-and-category',
data: {
authorities: ['ROLE_USER'],
pageTitle: 'Combined Product and Category'
},
views: {
'[email protected]': {
templateUrl: 'app/entities/combined/combined.html',
controller: 'CombinedController',
controllerAs: 'vm'
},
'category': {
templateUrl: 'app/entities/category/categories.html',
controller: 'CategoryController',
controllerAs: 'vm'
},
'product': {
templateUrl: 'app/entities/product/products.html',
controller: 'ProductController',
controllerAs: 'vm'
}
}
});
При этом страница/template (products.html и categories.html) вообще не отображается.
Привет @ Gaël Marziou, см. Мой обновленный ответ. Я думаю, что это в основном потому, что мне не хватает понимания углового -у. Но я понятия не имею, что я пропустил до сих пор. – xsalefter