Блог

Я установил angular-ladda с помощью browserify-shim / browserify, но не могу заставить кнопки работать должным образом. Когда я нажимаю на кнопку, счетчик находится за пределами кнопки, независимо от того, что data-style я использую.

Вы можете найти инструкции по установке browserify здесь, но они не сработали так, как я надеялся. Я закончил использовать информацию по этому вопросу на GitHub, чтобы помочь мне, но я не уверен, что я сделал это правильно.

Мои зависимости от приложений выглядят так:

 require('angular').module('admin', [
  require('Spinner'),
  require('Ladda'),
  require('angular-ladda')
])
  

Мои зависимости от файлов package.json выглядят следующим образом:

 "dependencies": {
    "aliasify": "^2.0.0",
    "angular": "^1.5.7",
    "angular-bootstrap-show-errors": "^2.3.0",
    "angular-breadcrumb": "^0.4.1",
    "angular-cookies": "^1.5.7",
    "angular-ladda": "^0.4.2",
    "angular-ui-router": "^0.3.1"
}

  "browser": {
    "angular": "./node_modules/angular/angular.js",
    "angular-breadcrumb": "./node_modules/angular-breadcrumb/release/angular-breadcrumb.js",
    "spin.js": "./node_modules/angular-ladda/node_modules/js/spin.js" 
  }
"browserify-shim": {
    "angular": {
      "exports": "angular"
    },
    "angular-ladda": {
      "depends": [
        "ladda"
      ]
    }, 
    "ladda": {
      "exports": "Ladda",
      "depends": [
        "spin.js"
      ]
    },
    "spin.js": {
      "exports": "Spinner"
    }
 }
  

Это gif того, как выглядит конечный результат: http://recordit.co/g2CmpETMC5.gif

Чего я не понял, так это того, что с browserify-shim вам все равно придется связать таблицу стилей. В моем случае мне пришлось скомпилировать файл css в файл less, используя:

 @import (less) "/node_modules/angular-ladda/node_modules/ladda/dist/ladda-themeless.min.css";