路由到子菜单Angularjs

在这个示例中，我需要的是，在plnkr.co/edit/5FVrydtTPWqYMhhLj03e?p=preview中，当我单击联系号码按钮时，它将重定向到联系人中的联系号码页面。路由到子菜单Angularjs

我使用Angular JS，希望有人能帮助我。

scotchApp.config(function($routeProvider) { 
    $routeProvider 

     // route for the home page 
     .when('/', { 
      templateUrl : 'pages/home.html', 
      controller : 'mainController' 
     }) 

     // route for the about page 
     .when('/about', { 
      templateUrl : 'pages/about.html', 
      controller : 'aboutController' 
     }) 

     // route for the contact page 
     .when('/contact', { 
      templateUrl : 'pages/contact.html', 
      controller : 'contactController' 
     }); 
});

贷https://scotch.io/tutorials/angular-routing-using-ui-router因为我分叉他们的榜样

来源

2016-03-05 bleykFaust

你的代码显示了NG-路线的例子，但你所提供的链接是一个UI路由器的例子。（$ routeProvider vs $ stateProvider）。

如果你会使用$stateProvider从角UI的路由器来定义你将使用在整个应用程序的状态会probabably更像以下几点：

$stateProvider.state('home', { 
    controller: 'mainController', 
    url: '/', 
    templateUrl: 'pages/home.html' 
}); 
$stateProvider.state('about', { 
    controller: 'aboutController', 
    url: '/about', 
    templateUrl: 'pages/about.html' 
}); 
$stateProvider.state('contact', { 
    controller: 'contactController', 
    url: '/contact', 
    templateUrl: 'pages/contact.html' 
});

你看到一个定义一个状态使用一个字符串来标识自己：例如：'home'，'contact'等。您可以使用来自ui-router的$state服务，并使用\[go(to, params, options)\]方法结合此标识符在状态之间切换。

过渡到新状态的便捷方法。 $ state.go在内部调用 $ state.transitionTo，但自动将选项设置为{ location：true，inherit：true，relative：$ state。$ current，notify：true }。这允许您轻松使用绝对路径或相对路径，并且只指定您想要更新的参数（同时允许未指定的参数从当前活动祖先的状态继承）。

所有您需要做的就是将您的maincontroller中的按钮事件耦合到您的按钮事件中。即：将$state注入您的mainController，并在您的按钮中将ng-click耦合到执行$state.go()的函数。

<button type="submit" ng-click="$state.go('contact')">Contact Numbers</button>

来源

2016-03-05 08:13:27 skubski

http://plnkr.co/edit/lUQT51CxfMayug93u6iR?p=preview @skubski – bleykFaust

我做了什么错@skubski？ – bleykFaust

var routerApp = angular.module（'routerApp'，['ui.router']）;,在您的应用程序中注入ngRoute。两个不同的库！你需要注入ui.router。然后容纳你的部分页面的容器是ng-view，你需要一个ui-view。另外你的代码中有很多的语法错误。 – skubski

路由到子菜单Angularjs

回答

相关问题