1

I'm implementing materialize CSS in my AngularJS website which has a structure like this: a .html view which is connected to a .js controller which communicates to the database using a .js service. I copied this sample dropdown code from materialize website:

<!-- 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>

But this dropdown is not working in my website. It also has a javascript code attached which I cant figure out where to place. I tried placing in my .js controller but still nothing. Can someone point me in the right direction.

Here are my .html and .js implementations:

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;
        });

  }]);
})();
  • I did my own custom select/dropdown (based on materialize CSS's select), work nice across browsers (it has JQuery dependency) . You can find it here: https://jsfiddle.net/rjpugte6/ – Konrud Jun 25 '16 at 15:19
  • thanks for the fiddle but I just want a simpler solution to the problem...I just know I'm missing something basic here and should just try to fix it... If anyone can just tell me how to get this materialize dropdown working, that would be a great help. – dARKaRK1002 Jun 26 '16 at 07:22

0 Answers0