Question

是否可以根据屏幕大小选择性地使用模板html文件？

.state('booklist', {
            url: '/booklist',
            templateUrl: window.innerWidth > 320 ? "largeScreen.html": "mobileScreen.html",
            controller: "TestController"
        })

我想知道这是使用模板html文件两种不同屏幕尺寸的合理方式，并且我没有弄清楚是有利有弊。

谢谢。

Answer 1

那＆＃39;好吗＆＃39;？它是一个解决方案，但却是一个非常糟糕的解决方案。您应该使用像Zurb Foundation或Twitter Bootstrap这样的响应式Web框架，它们可以为您提供风格，而不是程序逻辑。

我会根据这个项目的严肃性以及它将会有多大来打电话。你至少会头疼：

样式，因为您现在已经将样式混合到程序的逻辑中，并且需要记住每次进行布局相关的样式决策时
单元测试，因为每次运行单元测试时，您都需要记住手动修复窗口大小以确保加载正确的模板

这些听起来不太专业，但忘记你的黑客工作可能会浪费你几个小时的时间，这是一个简单的不良做法。

您应该使用CSS解决与样式相关的问题。

Answer 2

这是绝对合理的！这将根据您的屏幕尺寸更改网址！

职业选手？ - 它易于理解，易于使用并完成工作。

缺点？ - 如果您像在桌面/笔记本电脑上那样调整屏幕大小，它不会改变，但您可能不关心这一点。这绝对是一个极端的小案例，但如果你是一个完美主义者，那么它肯定是一个骗局！

正如彼得评论的那样，您当然应该考虑使用媒体查询而不是使用不同的模板，但是在某些情况下您可能希望较小的屏幕显示完全不同的内容（例如，您可能需要手风琴），在这种情况下很好

选择模板html与ui路由器

2 个答案: