Вложение пользовательского интерфейса в Angular UI Router

0

main.jade (релевантная часть)

div(ui-view="core")

обертоны /dashboard.jade

#dashboard(ng-controller="dashboardController")
    #main-panel(ui-view="mainPanel")
    #side-panel

    nav#top-nav

routes.js

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider) {

    // loads url from the index
    $urlRouterProvider.otherwise('/');

    $locationProvider.html5Mode(true);

    $stateProvider
        .state('splash', {

        })
        .state('dashboard', {
            abstract: true,
            url:'/dashboard',
            views: {
                'core' : {
                    templateUrl: '/partials/dashboard'
                },
                'mainPanel' : {
                    templateUrl: '/partials/calendar'
                }
            }
        })

}]);

Есть ли способ визуализации ui-view = "core", а также ui-view = "mainPanel", который находится внутри ядра?

Для справки, вот как я настроил частичные операции для работы с нефритом

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res) {
    res.render('main', { 
        title: 'Express' 
    });
});

router.get('/partials/:name', function (req, res) { 
    var name = req.params.name;
    res.render('partials/' + name);
});

module.exports = router;
Теги:
angular-ui-router
pug

1 ответ

1

Вы не можете иметь "вложенные" u-view на одном уровне (одно состояние). Потому что содержимое ui-view заменяется предоставленным шаблоном.
Чтобы mainPanel был внутри core он должен быть частью шаблона вложенного состояния.

.state('dashboard.main', {
    url:'/main',
    views: { mainPanel : ... }
}

Шаблон dashboard должен содержать ui-view="mainPanel"

Ещё вопросы

Сообщество Overcoder
Наверх
Меню