Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/node.js/41.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
AngularJS中的双ng视图/ui视图,是否可能?_Angularjs_Node.js_Ng View_Route Provider - Fatal编程技术网

AngularJS中的双ng视图/ui视图,是否可能?

AngularJS中的双ng视图/ui视图,是否可能?,angularjs,node.js,ng-view,route-provider,Angularjs,Node.js,Ng View,Route Provider,我正在开发一个平均堆栈的应用程序…问题是 如何划分应用程序的界面 我有一个静态页面(这样的网页)和一个应用程序页面,界面不同,但我遵循的开发是 在我的应用程序的“index.js”文件中,我将所有依赖项放在其中并设置。在这个文件中,我设置了静态页面的页眉和页脚,以便在所有html文件中不重复它。当我在静态页面上方导航时,它可以工作,但是当我开发应用程序页面时,我想更改主界面 那么,我必须重复代码吗?或者我可以设置像ng show这样的指令来显示每种情况下的每个接口吗 在这里,我向您展示了我的应用

我正在开发一个平均堆栈的应用程序…问题是

如何划分应用程序的界面

我有一个静态页面(这样的网页)和一个应用程序页面,界面不同,但我遵循的开发是

在我的应用程序的“index.js”文件中,我将所有依赖项放在其中并设置。在这个文件中,我设置了静态页面的页眉和页脚,以便在所有html文件中不重复它。当我在静态页面上方导航时,它可以工作,但是当我开发应用程序页面时,我想更改主界面

那么,我必须重复代码吗?或者我可以设置像ng show这样的指令来显示每种情况下的每个接口吗

在这里,我向您展示了我的应用程序的模型:

静态: 应用程序:

我的'index.js'文件的主体目标:

<body>

    <script>
            $(document).ready(function(){
                $('.button-collapse').sideNav();
            });
        </script>
    <!-- The var changeInterface control if we are on main page or app page-->
    <header>
            <nav class="dipu-green">
                <div class="nav-wrapper container" role="navigation">
                    <a id="logo-container" href="#" ui-sref="/()" class="" style="color:white" >
                        <b>R.U. Pino Montano</b>
                    </a>
                    <ul class="right hide-on-med-and-down">
                        <li>
                            <a href="#!/" style="color:white" >Inicio</a>
                        </li>
                        <!--data-activates="reportsDropdown"  dropdown-button -->
                        <li>
                            <a href="#!/news" style="color:white">
                                Noticias</a>
                        </li>
                        <li>
                            <a href="#!/info" style="color:white">
                                Información</a>
                        </li>
                        <li>
                            <a href="#!/team" style="color:white">
                                Equipo</a>
                        </li>

                        <li>
                            <a href="#!/services" style="color:white">
                                Servicios</a>
                        </li>
                        <li>
                            <a href="#!/contact" style="color:white">
                                Contacto</a>
                        </li>
                        <li>
                            <a href="#!/app" style="color:white">
                                Resi App</a>
                        </li>
                    </ul>
                    <ul id="nav-mobile" class="side-nav">
                        <li>
                            <a href="#!/">
                                <i class="material-icons">mood</i>Inicio</a>
                        </li>
                        <!--data-activates="reportsDropdown"  dropdown-button -->
                        <li>
                            <a href="#!/news">
                                <i class="material-icons">new_releases</i>Noticias</a>
                        </li>
                        <li>
                            <a href="#!/info">
                                <i class="material-icons">info</i>Información</a>
                        </li>
                        <li>
                            <a href="#!/team">
                                <i class="material-icons">people</i>Equipo</a>
                        </li>

                        <li>
                            <a href="#!/services">
                                <i class="material-icons">business</i>Servicios</a>
                        </li>
                        <li>
                            <a href="#!/contact">
                                <i class="material-icons">contact_mail</i>Contacto</a>
                        </li>
                        <li>
                            <a href="#!/app">
                                <i class="material-icons">exit_to_app</i>Resi App</a>
                        </li>
                    </ul>
                    <a href="#" data-activates="nav-mobile" style="color:white"  class="button-collapse">
                        <i class="material-icons">menu</i>
                    </a>
                </div>
            </nav>
        </header>
        <main>
            <div class="ribbon">
                <span>BETA</span>
            </div>
            <!-- el controlador se añade a una parte del body-->
                <div class="section">
                    <div ui-view></div>
                </div>
        </main>
        <footer class="page-footer dipu-green">
            <div class="container">
                <div class="row dipu-green">
                    <div class="col s12">
                        <div>
                            <h5>Contacto</h5>
                            <ul>
                                <li><i class="tiny material-icons">location_on</i> Avda. Alcalde Manuel del Valle nº 28</li>
                                <li>41008, Sevilla (España)</li>
                                <li><i class="tiny material-icons">account_balance</i> C.I.F.: XXXXX </li>
                                <li><i class="tiny material-icons">local_phone</i> Tel: XXX XXX XXX</li>
                                <li><i class="tiny material-icons">email</i> <a href="mailto:rupinomontano@gmail.com?Subject=Preguntas%20externas" target="_top">rupinomontano@gmail.com</a></li>
                                <li><i class="tiny material-icons">web</i><a href="https://rupinomontano.com" target="_blank"> rupinomontano.com</a></li>

                            </ul>
                        </div>
                    </div>
                    <div class="col s12">
                        <div>
                            <h5>Desarrollo</h5>

                        </div>
                    </div>
                    <div class="col s12">
                        <h5>Síguenos en</h5>
                        <div id="social">

                        </div>
                    </div>
                </div>
            </div>
            <div class="footer-copyright">
                <span style="margin-left:15%;">© 2018 Developed by </span>
            </div>
        </footer>

    </body>

$(文档).ready(函数(){
$('.button collapse').sideNav();
});
贝塔 联系人
  • Avda上的位置。阿尔卡德曼努埃尔山谷28号
  • 41008,塞维利亚(埃斯帕尼亚)
  • 账户余额到岸价:XXXXX
  • 本地电话:XXX XXX XXX
  • 电子邮件
德萨罗 斯盖诺斯 ©2018由以下机构制定:

提前谢谢你

在使用angularjs时,您可以创建一个单页应用程序。 回答你的问题

Q:我必须重复代码吗?

Ans-在angularjs中,您不应该重复您的代码,您可以在一个页面中维护公共部分,并可以从该页面渲染到不同的页面。这就是单页应用程序的优点。要创建单页应用程序,需要路由。要在angular js中实现路由,可以使用angular router包,也可以使用UI router包

请检查角度路由器的示例:

请检查此UI路由器示例:

Q:我可以设置像ng show这样的指令来显示每种情况下的每个界面吗?


Ans-您应该使用路由指令。根据这些指令,您可以导航到不同的页面,而无需再次重新加载页面。

显示您的代码我将添加它。如果它非常广泛是否重要?我正在使用包ui.router。因此,我可以将静态页面的页眉放在一个文件中,将静态页面的页脚放在另一个文件中。这样我可以在每一页上给他们打电话。并为应用程序界面创建其他文件?我怎样才能把它分开并命名呢?哪个指令?