1

我正在设计一个“自定义门户”，但我一直坚持如何以正确的方式设计我们的应用程序。该门户的视图如下图所示：

  1. 购物车下拉菜单，用户可以在其中选择“当前”购物车（可以为空）
    • 一个。重定向到“当前”购物车详细信息页面的按钮。
  2. 应用程序菜单。我们可以在哪里导航到目录
  3. 主要应用领域。 在此处输入图像描述

我有以下工作流程：

  • 用户进入目录菜单。

    网址：域/目录；状态：目录

  • 用户选择目录并查看目录中的产品

    网址：域/目录/目录1ID；状态：catalogs.detail。

  • 用户可以单击产品图块并转到产品详细信息视图

    url：域/目录/catalog1ID/product1ID；状态：catalogs.detail.product

看起来很自然，目前没有什么特别的。现在的主要问题是如何将“购物车”功能集成到此工作流程中。我的意思是，如果用户选择购物车，则视图上的数据可能会有所不同（因为购物车与不同的客户相关，我们可以为不同的客户显示不同的目录/价格/产品）。Fe 对于购物车 1 和购物车 2 和未选择的购物车，Catalog1 中 Product1 的价格可能不同。我正在尝试寻找下一个问题的答案：

  • 在哪里保留选定的购物车（州/网址）？
  • 如何告知当前状态购物车已更改？
  • 如何使 F5/refresh 正常工作（如果我当前的状态是catalogs.detail.product并且我选择了购物车）？
4

1 回答 1

0

听起来有很多问题需要回答，我会尝试提供一些指导来为您指明正确的方向，但这当然需要根据您的应用程序进行定制。

  1. 始终保持透视范围。例如，假设您的顶级范围 (rootScope) 存储购物车数据。您的应用程序中的任何其他状态都可以访问这些 rootScope 属性。因此，如果您需要跨多个状态持续存在的数据，则存储在 rootScope 之类的内容中将为子状态提供访问权限。现在请注意，将所有数据存储在应用程序 rootScope 中可能不是一个好主意，将数据存储在单个控制器中并赋予自定义指令访问这些控制器的权限会更有意义。这将使事情更加模块化，并且不会污染全局 rootScope

  2. 这可以通过在修改保存购物车数据的范围的指令中创建一个函数来轻松完成。

样本指令：

app.directive('pagedirective',function(){
  //directive definition object
  return{ 
    restrict:'E'
    templateUrl:'path to html template'
    link:function(scope){

      scope.update_Shopping_Cart_In_Controller = function(item){
        scope.shopping_Cart_Array.push(item)
      }
    }  

  }
})

样品控制器：

app.controller('shoppingCartCtrl',function($scope){
  //this will get updated from the directive
  $scope.shopping_Cart_Arr = [];
})

主页html：

<div ng-controller="shoppingCartCtrl">
  <p ng-repeat="items in shopping_Cart_Arr">{{items}}</p>
  <pagedirective></pagedirective?
</div>

指令html：

<div>
  <button ng-click="update_Shopping_Cart_In_Controller('new toy')">add item</button>
</div>

显然，您会希望您的指令 html 比这更智能，但我只是想要将数据从指令传递到控制器的模式。

  1. 如果您在应用程序中刷新页面，您将丢失任何未在加载时在控制器中初始化的数据。例如，如果您在一个页面上将商品添加到购物车控制器，然后刷新浏览器，则添加到该控制器的数据将会丢失。以下是解决该问题的几种方法。

    • 将数据保存到 sessionStorage 或 localStorage。这些数据在刷新期间不会丢失，让我习惯于在控制器中初始化数据。
    • 将数据保存到应用后端的用户表中，然后在需要时检索该数据。

如果有任何不清楚的地方，请告诉我，但希望这能为您指明正确的方向。

于 2016-03-30T14:58:18.083 回答