Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了AngularJS多页面应用程序站点Boilerplate站点结构建议大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在寻找一些指导,创建一个由Laravel BACkend提供服务的AngularJs多页面应用程序.网上的所有网络应用教程都指向创建SPA,我刚刚开始使用Angular – 所以请放轻松我.

ProductPage示例 – http://example.com/products/widget

<html data-ng-app='ExampleApp'>
    <head>
    </head>
    <body data-ng-controller='ProductController'>
        // ProductPage Content Served by laravel with angular tags

        <script type="text/javascript" src="/js/lib/angular.min.js"></script>
        <script type="text/javascript" src="/js/app.js"></script>
        <script type="text/javascript" src="/js/controllers/ProductController.js"></script>
    </body>
</html>

CartPage示例 – http://example.com/cart

<html>
    <head>
    </head>
    <body data-ng-controller='CartController'>
        // CartPage Content Served by web-server with angular tags

        <script type="text/javascript" src="/js/lib/angular.min.js"></script>
        <script type="text/javascript" src="/js/app.js"></script>
        <script type="text/javascript" src="/js/controllers/CartController.js"></script>
    </body>
</html>

因此,在上面的示例中,我创建了两个页面,这些页面由Web服务器提供,几乎都是静态内容.但是这些页面已经标记了角度标签.在每个静态页面上,我引用了一个不同的AngularJS控制器.

这是解决问题的正确方法,还是应该允许app.js加载控制器/注入依赖项?

此外,在这个多页应用程序中的控制器之间共享数据的任何指导以及与正常资源/示例的链接都将非常有用.我需要通过,例如从产品页面添加到购物车到api的商品,然后再次查询此API以检索购物车内容

您应该包含ngRoute模块,让AngularJS为您加载控制器.请参阅AngularJS文档以了解如何使用路由.

至于在控制器之间共享数据,服务就是您正在寻找的.创建服务就像这样简单:

app.factory("servicename",[function() {
    return {
        somevar: "foo"
    };
}]);

然后,在您的控制器中,您注入这样的服务:

app.controller("ContactCtrl",["$scope","servicename",function($scope,svC) {
    $scope@L_612_20@mevar = svc@L_612_20@mevar;
}]);

只要您不导致物理页面重新加载(这就是您应该使用NgRoute加载控制器的原因),服务的状态将保留.

大佬总结

以上是大佬教程为你收集整理的AngularJS多页面应用程序站点Boilerplate站点结构建议全部内容,希望文章能够帮你解决AngularJS多页面应用程序站点Boilerplate站点结构建议所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。