Question

我正在AngularJS网站上实现物化CSS，其结构如下： .html视图连接到.js控制器，该控制器使用.js服务与数据库通信。我从materialize网站复制了这个示例下拉代码：

<!-- Dropdown Trigger -->
<a class='dropdown-button btn' href='#' data-activates='dropdown1'>Drop Me!</a>

<!-- Dropdown Structure -->
<ul id='dropdown1' class='dropdown-content'>
 <li><a href="#!">one</a></li>
 <li><a href="#!">two</a></li>
 <li class="divider"></li>
 <li><a href="#!">three</a></li>
</ul>

但是这个下拉列表在我的网站上无效。它还有一个附加的JavaScript代码，我无法弄清楚在哪里放置。我尝试放入我的.js控制器，但仍然没有。有人能指出我正确的方向。

这是我的.html和.js实现：

manage_projects.html

<td>{{prj.name}}</td>
<td>
 <a class="dropdown-button" href="" data-activates="dropdown">
   {{prj.skills.length}} skill(s)
 </a>
 <ul id="dropdown" class="dropdown-content">
   <li ng-repeat="skl in prj.skills">
     {{skl.name}}
   </li>
 </ul>
</td>

ManageProjectsController.js

(function () {
'use strict';

angular.module('app')
.controller("ManageProjectsController", ['$scope', '$rootScope', '$location', 'UserService', 'ManageProjectService', function ($scope, $rootScope,$location, UserService, ManageProjectService) {


        if(UserService.GetCurrentUser().role !== 'Executive'){
         $location.path('/dashboard');          
        }

        $scope.projects = "";

        $('.dropdown-button').dropdown();

        ManageProjectService.GetAllProjects().then(function(res){
            $scope.projects = res.data.projects;
        });

  }]);
})();

如何在物化CSS中为下拉列表添加javascript？

0 个答案: