Angularjs + Zurb基金会,他们一起打得好吗?

时间:2013-07-17 20:33:58

标签: angularjs zurb-foundation

我很难设置一个角度和基础3的项目(后端的导轨)。所以我一直在搜索,但结果并不多。

我正在从子文件夹(localhost:3000 / app)提供角度,并启动了类似这样的html

!!!5
%html{ "ng-app" => "App" }
  %head
    -# I tried this for html5 url on angular, not so much help so far
      %base{:href => "/app/"}
    %title
      NG APP
      ...
  %body
    %header
      ...
    %main
      = yield
    %footer
      ...
    = javascript_include_tag "application"
    = yield :javascripts

一些观点工作就好了。但是当我尝试使用基础选项卡时,我可以完成工作,因为角度将锚点作为一个url传递给$ routeProvider进行检查。

所以,我在这里检查一些问题,部分答案给我的印象是基础工作很好,在角度上启用html5模式。 (我可以做到)和其他答案说,为了使角度的工作基础应该为基础上的每个组件编写指令。或者最后一个案例是转移到Twitter Bootstrap。

所以,我可以找到一个统一的答案,请你,请确认我现在是否可以直接使用角度基础。感谢。

3 个答案:

答案 0 :(得分:4)

最好的选择是在角度服务中包装Foundation插件,或者仅使用随框架提供的CSS / SASS并从头开始重新创建行为。专注于使用标记+样式表进行原型设计,然后以角度方式创建逻辑。至少,如果我需要/必须使用Foundation,我会这样做。

Twitter Bootstrap以类似的方式工作,移植到这个框架的唯一好处是你可以找到大量包含可用插件的角度模块/指令。在这种情况下,你不必两次做好同样的工作。

  1. 首先看一下:http://mgcrea.github.io/angular-strap/
  2. 然后在Bower.io Components Directory
  3. 中查找基于bootstrap的组件

    此外,正如评论中的一些人所提到的,您可能需要手动引导您的应用程序,这就像将应用程序包装到模块中并运行一样简单:

    angular.bootstrap(element[, modules]);
    
    // http://docs.angularjs.org/api/angular.bootstrap
    

    正如我所说,通常最好不要重新发明轮子。

    修改:

    关于此主题的Google网上论坛有一个有趣的讨论(毫不奇怪,用户的结论非常相似):https://groups.google.com/d/msg/angular/Htkzt7Fsaog/TeFm5l4snTwJ

答案 1 :(得分:3)

以下是Angular UI Bootstrap组件几乎完全适用于Foundation CSS:http://madmimi.github.io/angular-foundation/

答案 2 :(得分:1)

你可以在github上使用angular-ui-foundation库,它可能是最好的起点,

https://github.com/mhayes/angular-ui-foundation