angulaire.js - ui.router a deux niveaux d'imbrication. Le premier niveau peut être sauté, mais pas le deuxième niveau.
天蓬老师
天蓬老师 2017-05-15 17:11:32
0
2
671

top.html

<header class="en-tête xh-transition xh-boxShadow" layout="ligne espace vertical entre">

<a href="#" class="left-nav xh-block xh-a-fff underline-none">
    <i  class="fa fa-heart-o vertical-text-top" aria-hidden="true"></i>
    <span  class="vertical-middle">joyKit</span>
</a>
<span class="xh-relative">
    <button class="menu-btn xh-background-none xh-border-none xh-none768k" type="button">
        <svg class="menu transition" viewBox="0 0 40 40">
            <g>
                <path d="M24,16c2.2,0,4-1.8,4-4s-1.8-4-4-4c-2.2,0-4,1.8-4,4S21.8,16,24,16z" fill="rgba(51,102,153,1)" transform="rotate(9720 24 12)"></path>
                <path d="M24,20c-2.2,0-4,1.8-4,4s1.8,4,4,4c2.2,0,4-1.8,4-4S26.2,20,24,20z"  fill="rgba(51,102,153,1)" transform="rotate(9720 24 24)"></path>
                <path d="M24,32c-2.2,0-4,1.8-4,4s1.8,4,4,4c2.2,0,4-1.8,4-4S26.2,32,24,32z"  fill="rgba(51,102,153,1)" transform="rotate(9720 24 36)"></path>
            </g>
        </svg>
    </button>
    <input class="checkbox" type="checkbox" />
    <ul class="floatfix wow bounceInRight">
        <li class="nav-item pull-left">
            <a ui-sref="index" class="xh-a-fff">导航1</a>
        </li>
        <!-- /.nav-item -->
        <li class="nav-item pull-left">
            <a ui-sref="test" class="xh-a-fff">导航2</a>
             <ul>
               <li><a ui-sref=".test2" class="xh-a-fff">erji</a></li>
            </ul>
        </li>
        <!-- /.nav-item -->
        <li class="nav-item pull-left">
            <a href="#" class="xh-a-fff">导航3</a>
        </li>
        <!-- /.nav-item -->
        <li class="nav-item pull-left">
            <a href="#" class="xh-a-fff">导航4</a>
        </li>
        <!-- /.nav-item -->
        <li class="nav-item pull-left">
            <a href="#" class="xh-a-fff">导航5</a>
        </li>
        <!-- /.nav-item -->
        <li class="nav-item pull-left">
            <a href="#" class="xh-a-fff">导航6</a>
        </li>
        <!-- /.nav-item -->
    </ul>
</span>

</en-tête>

app.js
/***

  • Créé par joykit le 12/01/2017.
    */

(fonction () {

'use strict';
var app = angular.module('app', [
    'ui.router'
]);
app.config(['$stateProvider', '$urlRouterProvider',function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.when('', 'index');
    $stateProvider.state('index',{
        url: '/index',
        templateUrl: 'views/index.html',
        menu: 'index'
    }).state('test',{
        url: '/test',
        templateUrl: 'test.html',
        menu: 'test'
    }).state('test.test2',{
        url: '/test2',
        templateUrl: 'test2.html',
        menu: 'test2'
    });
}]);

})(angulaire);

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

répondre à tous(2)
滿天的星座
parent: 'test'   吗?
phpcn_u1582
<ul class="floatfix wow bounceInRight">
        <li class="nav-item pull-left">
            <a ui-sref="index" class="xh-a-fff">导航1</a>
        </li>
        <!-- /.nav-item -->
        <li class="nav-item pull-left">
            <a ui-sref="test" class="xh-a-fff">导航2</a>
             <ul>
               <li><a ui-sref="test.test2" class="xh-a-fff">erji</a></li>
            </ul>
        </li>
    </ul>
$urlRouterProvider.when('', 'index');
    $stateProvider.state('index',{
        url: '/index',
        templateUrl: 'views/index.html',
        menu: 'index'
    }).state('test',{
        url: '/test',
        templateUrl: 'test.html',
        menu: 'test'
    }).state('test.test2',{
        url: '/test2',
        templateUrl: 'test2.html',
        menu: 'test2'
    });
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal