Question

在我的应用程序中，我有一个幻灯片样式界面。在其中一张幻灯片中，我想有条件地展示某件事（即if Meteor.user().profile.asdf）。我想通过导航从主页面上的链接显示完全相同的页面（所以如果你在URL /item/123）。如何在不重复所有代码的情况下执行此操作？更具体地说，在我的路由器中我有：

.state('item', {
  url: '/item/:itemId',
  templateUrl: 'client/templates/itemView.html',
  controller: 'itemViewCtrl as item',
  resolve : {
    liftId : ['$stateParams', function($stateParams){
      // console.log($stateParams.liftId);
      return $stateParams.liftId;
    }]
  }
})

在通过URL访问的页面上，我通过item.helper.whatever访问数据。是否有快捷方式将此页面作为<ng-include src="'client/templates/itemView.html'"></ng-include>或其他内容包含在主页中？

Answer 1

如果两个组件的templateUrl相同，Angular应自动执行此操作。 Angular使用$templateCache。 Reference

当angular获取URL时，它将首先检查$templateCache，并且会意识到模板来自同一个地方，而不是再次获取静态内容。相反，它将使用$templateCache

中存储的那个

您可以通过查看开发人员工具中的网络流量来验证这一点。只应发送一个该网址请求。

如果不是，或者您想确保使用相同的模板，则另一种方法是使用手动将模板添加到缓存中。

$templateCache.put('templateId.html', 'This is the content of the template');

然后您使用templateUrl而不是State使用template

如何在AngularJS中重用通过url和条件语句访问的内容

1 个答案: