如何使用纳克开关，作为我的ngRoute＆功放页面路由器; ngView？

问题描述

下面是我的角SPA的高层骨架。我的应用程序即将大专学历的产品。在工程页都有这是目前内置纳克开关，我想尽可能路线转换在一个单独的左导航。我该怎么做，只是采用了棱角分明的本地路由角route.js？

  ** ** app.js
（功能（）{
   VAR应用= angular.module（myCollege，['ngRoute']）;   的app.config（['$ routeProvider'，'$ locationProvider'，
          功能（$ routeProvider，$ locationProvider）{            $ routeProvider                 。什么时候（'/'， {
                       templateUrl：应用程序/视图/ /home.html的，
                       控制器：HomeController中
                       }                    。当（'/ ENGG'，{
                       templateUrl：应用程序/视图/ engineering.html
                       控制器：engineeringController
                       }）
                    。当（'/ MED'，{
                       templateUrl：应用程序/视图/ medical.html
                       控制器：medicalController
                       }）                  }]）;
 

**engineering.html**

<div nav ng-switch on="pagename()">
        <div ng-switch-when="Civil Engineering">
               <div civil-directive> </div>
         </div>
         <div ng-switch-when="Computer Engineering">
               <div computer-directive> </div>
         </div>
         <div ng-switch-when="Nano Engineering">
               <div nano-directive> </div>
         </div>
         <div ng-switch-when="Electrical Engineering">
               <div electrical-directive> </div>
         </div>
     </div>

EngineeringController.js

(function() {
var app =angular.module("collegeApp");
var engineeringController= functino($scope,$rootscope,$location)

 {

   $scope.pagename = function() {
      return $location.path();
   };
app.controller("engineeringController",['$scope','$rootScope','$location',engineeringController])
}());

The above logic is not working for me. Can someone tell me where i am doing the wrong?

解决方案

Not a good practice but here's what you want to do if you want to use ng-switch:

In your html, as you write for example:

<!-- don't forget to reference your app and your controller -->
<button ng-click="goTo('/page1')">Go to page 1</button>
<button ng-click="goTo('/page2')">Go to page 2</button>
<div nav ng-switch on="pagename()">
     <div ng-switch-when="'/page1'"></div>
     <div ng-switch-when="'/page2'"></div>
</div>
<div ng-view> </div>

in js

Config your routes
app.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.
            when('/page1', {
                templateUrl: 'views/page1.html'
            }).
            when('/page2', {
                templateUrl: 'views/page2.html'
            }).
            otherwise({
                redirectTo: '/'
            });
    }])

and add the following in your controller:

$scope.pagename = function() { return $location.path(); };

    $scope.goTo = function(page){
        $location.path(page);
    }

In the html above, ng-switch will use the $location.path() variable to know which view to display.

As I said this is not a good practice, because your controller isn't suppose to deal with routes.

这篇关于如何使用纳克开关，作为我的ngRoute＆功放页面路由器; ngView？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！