角度滑动模块

时间:2015-08-08 14:28:26

标签: angularjs slidetoggle

我尝试使用this module来提供slideToggle行为。原始代码工作正常

<li ng-click="showMe=!showMe" ng-repeat="team in teams">
  <a><h4>{{ team.name }}</h4></a>
  <div ng-show="showMe">
    <a ng-href="team/{{team.slug}}">{{ team.name }}</a>
      <ul>            
        <li ng-repeat="child in team.children">
          <a ng-href="/team/{{child.slug}}">{{ child.name }}</a>
       </li>
     </ul>
  </div>
</li>

我已经用bower安装了上面的模块,将团队视图更改为

<li ng-click="showMe=!showMe" ng-repeat="team in teams">
  <a><h4>{{ team.name }}</h4></a>
  <div ng-slide-down="showMe" lazy-render duration="0.5">
    <a ng-href="team/{{team.slug}}">{{ team.name }}</a>
      <ul>            
        <li ng-repeat="child in team.children">
          <a ng-href="/team/{{child.slug}}">{{ child.name }}</a>
       </li>
     </ul>
  </div>
</li>

并将该模块包含在我应用的依赖项中。

app.coffee

myApp = angular.module("myApp", [
  "ngRoute"
  "angulartics"
  "angulartics.google.analytics"
  "ng-slide-down"
])
teamy.config [
  "$routeProvider"
  "$locationProvider"
  ($routeProvider, $locationProvider) ->
  $locationProvider.html5Mode(true).hashPrefix "!"

  $routeProvider
    .when "/",
      templateUrl: "/views/teams.html"
      controller: "Teams"
]

当我将ng-slide-down添加为依赖项时,视图中断。我是角色和接管现有应用程序的新手,所以任何帮助将不胜感激。我还使用grunt重新启动了服务器。

1 个答案:

答案 0 :(得分:0)

通常在Angular中添加模块依赖项后“事情发生故障”时,意味着在依赖它的模块之前未正确加载所需模块。

通过检查源JS文件,我会检查浏览器中是否实际加载了所需的lib。如果应用程序使用的是连接文件,例如vendor.js,可能是通过搜索一个字符串来识别ng-slide-down lib,如“.module('ng-slide-down'”(source file)。

如果你找不到它,那就暗示grunt出于任何原因不包含该文件,你可以进一步调查构建配置。

如果不是这种情况(模块在那里并加载),请你详细说明应用程序如何破解?控制台输出会有所帮助。

相关问题