マスターページの子ページエフェクトを作成するAngular JS

このマスターページと子ページの機能は、HTMLを使用し、AngularJSを使用してWeb Apisを呼び出すアプリケーションで必要です。マスターページの子ページエフェクトを作成するAngular JS

私は、このシナリオでは、ルーティングに問題を抱えています。 Route.jsにルーティングするために使用

コード：

var MainApp = angular.module('MainApp', ['ngRoute']); 
MainApp.config(function ($routeProvider, $locationProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl: '../partials/DashboardMenu.html', 
     controller: 'DashboardMain' 
    }) 
    .when('/Holidays', { 
     templateUrl: '../partials/Holidays.html', 
     controller: 'Holidays' 
    }) 
    .when('/Projects', { 
     templateUrl: '../partials/Projects.html', 
     controller: 'Projects' 
    }) 

    $locationProvider.html5Mode(true); 
    $locationProvider.hashPrefix('!'); 
});

Dashboard.html

<body ng-app="MainApp" ng-controller="DashboardMainController"> 
<div class="view-animate-container"> 
    <div ng-view class="view-animate"></div> 
</div>

DashboardMenu.html

<div class="container-fluid btn-group"> 
<div class="row"> 
    <a href="../partials/MyProfile.html" class="thumbnail"> 
     <img src="" alt="My Profile" /> 
    </a> 

    <a href="../partials/Projects.html" class="thumbnail"> 
     <img src="" alt="Projects List" /> 
    </a> 

    <a href="../partials/Holidays.html" class="thumbnail"> 
     <img src="" alt="Holidays List" /> 
    </a> 
</div>

以下は

自分のアプリケーションのフォルダ構造です：ログインページからユーザがログインした後

、ユーザーがDashboardMenu.html

として、デフォルトの子ビューでDashboard.htmlにリダイレクトする必要があります

ログインService.csでは、ユーザーを認証して、下のコードスニペットを使用してDashboard.htmlにリダイレクトしようとすると、Dashboard.htmlでURLが追加されます。このため

$location.path('DashboardMenu.html')

、私はDashboard.htmlとlocationProvider.html5modeで<base href="/" />とhasprefixを追加しましたが、何も私のために働いていません。私が逃している場所を教えてください。

出典

2016-06-26 Pavan Kumar

ngRouteで何らかのバージョンの入れ子にされたビューを実装しようとしているようですが、これはサポートしていません。入れ子状態をサポートしているui-routerを使用することをお勧めします。

出典

2016-06-26 21:26:46

$location.path()は

が

$location.path('/')

と同じ

に

$location.path('DashboardMenu.html')

を変更してみてください、あなたのルーティングの設定に一致するURL値に.....ないテンプレートパスに設定する必要がありますあなたのhref値....必ずサーバーがhtml5Mode

を使用するために構成されていることを確認します。また、削除する必要があります。URLでなければなりません

Chnge

<a href="../partials/Projects.html" class="thumbnail">

<a href="/Projects" class="thumbnail">

にメモをテンプレートではありません ng-controllerは、既にルーティング設定でコントローラが宣言されているルーティングで使用されるテンプレートから生成されます。そうでなければ、あなたはいくつかのより多くのチュートリアル

出典

2016-06-26 22:02:09 charlietfl

コードの$ location.path（「DashboardMenu.html」）を勉強示唆する

を実行しているコントローラの2つのインスタンスで終わるだろうloginService、JSファイルです。上記のフォルダ構造を参照してください。私はlocation.path（ '/'）に変更しました。また示されたhref値を変更しました。テンプレートファイルにはコントローラがありません。それでも、ngviewをDashboardMenu、htmlに設定してDashboard.htmlにリダイレクトすることはできません。 –

サーバがhtml5mode用に設定されていますか？私は実際にあなたがこのすべての仕組みについてのチュートリアルを勉強するのにもう少し時間を費やす必要があると思います。 'path（）'はテンプレートファイルを指しません – charlietfl

マスターページの子ページエフェクトを作成するAngular JS

答えて

関連する問題