为什么UI路由器可以使用指令?

时间:2016-07-10 04:36:46

标签: angularjs angularjs-directive angularjs-routing

好吧,我从未使用过,也从未觉得我应该使用UI路由器。我在其中一次采访中被问到这个问题,如果我作为AngularJs的开发人员遗漏了一些内容,那就感觉就像在阅读。

现在,互联网上的解释显示了它基于组件的模块性和可重用性的优势。嵌套观点等

如果我想在视图中重用组件,那么我不能使用指令而不是新状态吗?根据ui路由器的scotch.io(顶级谷歌搜索结果)this article ,我可以在视图中使用单独的数据/控制器。好吧,我不能通过指令的控制器和模板做同样的事情。我仍然可以重复使用我想要的次数。

如果我遗漏了一些很酷的功能,请告诉我,并使其在AngularJs应用程序中使用它是一个典型的(当然是一个有很多可重用组件的大型组件)。

2 个答案:

答案 0 :(得分:2)

路由器的重点是它使用URL来改变状态。如果您刚刚使用了指令,则必须编写自己的机制来同步具有特定指令的URL。

答案 1 :(得分:0)

AngularJS是单页面应用程序的框架。

单页申请(SPA)

单页应用程序是一个Web应用程序,它可以加载单个HTML页面,并在用户与应用程序交互时动态更新页面中的片段。

John Papa的blog简单地解释了SPA。

我看到SPA的最大优势是

  • 加载应用程序后,状态将保持不变 用户导航时要求服务器往返。

  • 用户可以将深层链接添加到您的应用程序中。当用户打开书签时,SPA框架(AngularJS)将负责加载所需的状态。

虽然技术上可以在非SPA应用程序中实现上述目标,但它从未像SPA那样简单。

SPA对于包含许多页面的高度复杂的应用程序非常有用。对于2-3页的简单应用程序,jQuery是可行的方法。

阅读Single Page Application: advantages and disadvantages了解更多讨论

您可能知道所有这些,我认为您正在尝试使用指令实现SPA。

路由

路由框架根据用户操作动态地将视图加载到主页面中,而不刷新整个应用程序;提供SPA效果。

有两种流行的AngularJS路由框架可用。

  • ngRoute
  • UI-路由器

ngRoute基于URL映射,UI-Router基于状态名称映射。我更喜欢UI-Router

路由与指令

  

现在,互联网上的解释显示了它的实力   模块化和组件的可重用性。嵌套观点等。

是指令用于模块化和可重用性,可以动态加载视图,但无法根据用户操作动态选择视图。您必须在指令中编写复杂条件以动态选择视图。

例如,如果您的应用程序包含3个链接,则需要根据用户单击的链接显示视图。

使用指令,您需要跟踪用户点击的内容,并编写一个糟糕的条件来选择要显示的视图。大多数情况下,您将无法实现此效果,因为可以通过多种方式访问​​链接。

另一方面,一旦配置了路由,当用户单击链接时,将动态加载相应的模板。根据用户操作更改视图更容易。

另一个优点。当用户打开深度链接到应用程序的书签时,路由框架将负责加载状态(使用指令无法实现此目的)。感觉设计应用程序更自然。

选择是你的。