2014-11-20 6 views
0

angular.js가있는 응용 프로그램을 작성하고 해당 페이지를 기반으로 다른 하위보기를로드하려고합니다. 특히 사용자가 영어 버전에 착륙 할 때 부분 뷰가로드되고 프랑스어 버전에 착륙하면 다른 뷰가로드됩니다. 하지만 내 코드에서 보지 못하는 것이 무엇이든간에 하위 뷰는 항상 ELSE (또는 '/') 경로에 위치합니다. 이것은 내 appRoutes.js 파일의 현재 코드입니다 ...언어에 따라 다른 하위보기로 다시 경로 지정

angular.module('appRoutes', []).config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 

var homeLang = document.documentElement.getAttribute('lang'); 
var english = 'en'; 

var homeView = function (homeLang) { 

    if (homeLang === english) { 
     homeView = '/'; 
     return homeView; 
     } else { 

     homeView = '/accueil'; 
     return homeView; 
    } 
}; 

$routeProvider 

    // client routes 

    .when('/', { 
     templateUrl: 'views/home.html', 
     controller: 'MainController' 
    }) 

    .when('/web', { 
     templateUrl: 'views/web.html', 
     controller: 'MainController' 
    }) 

    .when('/design', { 
     templateUrl: 'views/design.html', 
     controller: 'MainController' 
    }) 

    .when('/hosting', { 
     templateUrl: 'views/hosting.html', 
     controller: 'MainController' 
    }) 

    .when('/contact', { 
     templateUrl: 'views/contact.html', 
     controller: 'MainController' 
    }) 

    .when('/accueil', { 
     templateUrl: 'views/accueil.html', 
     controller: 'MainController' 
    }) 

    .when('/sites', { 
     templateUrl: 'views/sites.html', 
     controller: 'MainController' 
    }) 

    .when('/services', { 
     templateUrl: 'views/services.html', 
     controller: 'MainController' 
    }) 

    .when('/hebergement', { 
     templateUrl: 'views/hebergement.html', 
     controller: 'MainController' 
    }) 

    .when('/contactez', { 
     templateUrl: 'views/contactez.html', 
     controller: 'MainController' 
    }) 

    .otherwise({ redirectTo: homeView }); 

$locationProvider.html5Mode(true); 

}]); 

다음은 다른보기를로드하는 HTML입니다.

<body ng-app="myApp"> 
<div class="navbar-wrapper"> 
<div class="container"> 
    <div role="navigation" class="navbar navbar-inverse navbar-static-top"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
     <button type="button" data-toggle="collapse" data-target=".navbar-collapse" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button> 
     </div> 
     <div class="navbar-collapse collapse"> 
     <div class="nav navbar-nav"> 
      <li><a href="/accueil">Accueil</a></li> 
      <li><a href="/sites">Sites & Apps</a></li> 
      <li><a href="/services">Design</a></li> 
      <li><a href="/hebergement">Hébergement</a></li> 
      <li><a href="/contactez">Contact</a></li> 
     </div> 
     </div></div></div></div></div> 
<section class="content"> 
<div ng-view></div></section></body> 

답변

0

실제로 코드로 돌아가서 ui-router를 사용하고 빌딩 블록 (여러 개의보기)이있는 상태를 만들었고 모든 문제를 해결했습니다! :)

+0

해결책을 알려주십시오. 나는 또한 그것을 필요로한다. 나는 그것을 이해할 수 없다. – zeppelin

0

보기에서 라우팅을 변경하지 않고도 언어를 기반으로 다른 템플릿을로드 할 수 있습니다. 예를 들어 의 경우 라우팅 된보기에 과 같은 값을 가질 수 있습니다. 각 범위 앞에 ng-if를 추가하여 언어 값을 확인할 수도 있습니다.

+0

sagie

+0

일반적으로이 작업을 수행하지만 HTML 파일에서는 다른 페이지를로드 할 수 있습니다. 위의 코드 중 일부는 프랑스어 버전에 속하고 다른 일부는 영어 버전에 속합니다. 로드 할 때 ng-view에서 기본보기를 설정할 수 있습니까? 그런 다음 탐색을 클릭하면 다른보기가로드됩니다. 위의 HTML을 추가했습니다. –

+0

처음 로그인 할 때 기본 경로 인 .when ('/', { templateUrl : '보기/home.html', 컨트롤러 : 'MainController' }) – sagie

관련 문제