maria
maria

Reputation: 159

Slick javascript installed in MEAN stack ANGULAR

I'm trying to do set this up in one of my views: http://kenwheeler.github.io/slick/

no matter where I put the following code:

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        console.log("slicking");
        $('.butikk').slick({});
    });
</script>

it wont activate the slick.

I tried in the main view body, at the end of body, I tried in the view where the .butikk is.

How can i make Slick work?

I dont know if it would work in angularjs envoirement

if I try the slicker in the console:

Uncaught TypeError: $(...).slick is not a function(…)

but I believe that error is occuring cause its not loaded correctly, don't get the error elsewhere in the code, only if I call it from the console log.

EDIT1:

on trying this http://vasyabigi.github.io/angular-slick/ im having a heavily load to my site. it wont load. and angular is taking too long.

i also got this on install:

    Unable to find a suitable version for angular, please choose one by typing one of the numbers below:
    1) angular#~1.3.0 which resolved to 1.3.20 and is required by angular-slick#0.2.1
    2) angular#1.5.5 which resolved to 1.5.5 and is required by angular-animate#1.5.5
    3) angular#^1.0.8 which resolved to 1.5.8 and is required by angular-ui-router#0.2.18
    4) angular#~1.5.0 which resolved to 1.5.8 and is required by meanjs
    5) angular#>=1.4.0 which resolved to 1.5.8 and is required by angular-bootstrap#1.2.5
    6) angular#^1.1.5 which resolved to 1.5.8 and is required by angular-file-upload#2.2.0

Prefix the choice with ! to persist it to bower.json

bower file:

    {
  "name": "meanjs",
  "description": "Fullstack JavaScript with MongoDB, Express, AngularJS, and Node.js.",
  "homepage": "http://meanjs.org/",
  "license": "MIT",
  "dependencies": {
    "angular": "~1.5.0",
    "angular-animate": "~1.5.0",
    "angular-bootstrap": "~1.2.1",
    "angular-file-upload": "~2.2.0",
    "angular-messages": "~1.5.0",
    "angular-mocks": "~1.5.0",
    "angular-resource": "~1.5.0",
    "angular-ui-router": "~0.2.18",
    "bootstrap": "~3.3.6",
    "owasp-password-strength-test": "~1.3.0",
    "angular-slick": "~0.2.1"
  },
  "resolutions"    : {
    "angular"  : "1.3.15",
  }

  "overrides": {
    "bootstrap": {
      "main": [
        "dist/css/bootstrap.css",
        "dist/css/bootstrap-theme.css",
        "less/bootstrap.less"
      ]
    },
    "jquery": {
      "main": []
    }
  }
}

edit 2:

tried bower update

then i got this:

Unable to find a suitable version for angular, please choose one by typing one of the numbers below:
    1) angular#~1.3.0 which resolved to 1.3.20 and is required by angular-slick#0.2.1
    2) angular#1.5.8 which resolved to 1.5.8 and is required by angular-animate#1.5.8, angular-messages#1.5.8, angular-mocks#1.5.8, angular-resource#1.5.8
    3) angular#>=1.4.0 which resolved to 1.5.8 and is required by angular-bootstrap#1.2.5
    4) angular#~1.5.0 which resolved to 1.5.8 and is required by meanjs
    5) angular#^1.1.5 which resolved to 1.5.8 and is required by angular-file-upload#2.2.0
    6) angular#^1.0.8 which resolved to 1.5.8 and is required by angular-ui-router#0.2.18

Prefix the choice with ! to persist it to bower.json

Upvotes: 0

Views: 105

Answers (1)

Quentin
Quentin

Reputation: 191

With some search on github issues of the slick repository, I found this angular-slick library. It seems pretty simple to use, try it

Upvotes: 1

Related Questions