0

現在AngularJsプロジェクトでやっています

私は2つのフォルダを持っています

1 つはインデックス フォルダとページで、このフォルダには 4 つのメニューを含む 1 つのインデックス ページがあります。

インデックス ページ コード:

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8"/>
        <title>Learn AngularJS - Inline Editor</title>

        <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet" />

        <!-- The main CSS file -->
        <link href="style.css" rel="stylesheet" />

        <!--[if lt IE 9]>
            <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>

    <!-- Notice the controller directive -->
    <body ng-app ng-controller="InlineEditorController">

        <!-- When this element is clicked, hide the tooltip -->
        <div id="main" ng-click="hideTooltip()">

            <!-- This is the tooltip. It is shown only when the showtooltip variable is truthful -->
            <div class="tooltip" ng-click="$event.stopPropagation()" ng-show="showtooltip">

                <!-- ng-model binds the contents of the text field with the "value" model.
                     Any changes to the text field will automatically update the value, and
                     all other bindings on the page that depend on it.  -->

                <input type="text" ng-model="value" />
            </div>

            <!-- Call a method defined in the InlineEditorController that toggles
             the showtooltip varaible -->
            <p ng-click="toggleTooltip($event)">{{value}}</p>

        </div>

        <!-- Include AngularJS from Google's CDN -->
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
        <script src="script.js"></script>
    </body>
</html>

ホーム、プロジェクトなどの4つのメニュー

1 つのホーム メニューをクリックすると、次の画像のようなコンテンツが表示されます。

ここに画像の説明を入力

プロジェクトメニューをクリックすると、この下の画像を参照してください

ここに画像の説明を入力

どちらの方法もコンテンツ（テキスト）のみを表示するのに役立ちますが、別のページ（テキストではない）を表示したい

プロジェクト ページ (html) があります。プロジェクト メニューを選択すると、プロジェクト ページが表示されます。

インデックスページがマスターページのようで、他のページがコンテンツページのようですか？angularjs で可能ですか?

4

2 に答える 2

2

このドキュメントをご覧になることをお勧めします - http://docs.angularjs.org/api/ngRoute.directive:ngView

それはあなたがやりたいことを達成するのに役立つはずです。

また、たとえば、ng-app に関する角度のガイドラインに従うこともできます。

<div ng-app="myApp">
    <div ng-controller="MainCtrl">
        <!-- controller logic -->
    </div>
</div>

それが役立つことを願っています。

于 2013-10-08T06:30:15.263 に答える