How to apply UiKit Upload in Angular?

0

Look at the documentation!

UIKIT DOCUMENTATION

I have an Angular project and I am trying to implement upload using Uikit, I have installed the resources with these commands;

npm install jquery --save
npm install uikit --save

But I'm not able to enable Javascript for the Uikit files, I do not know if I'm doing something wrong.

And I've added these lines in the .angular-cli.json

For CSS it was:

"../node_modules/uikit/dist/css/uikit.min.css",

and for Javascript it was:

  "../node_modules/jquery/dist/jquery.min.js",
"../node_modules/uikit/dist/js/uikit.min.js",
"../node_modules/uikit/dist/js/uikit-icons.min.js",

looks like this:

"styles": [

        "../node_modules/bootstrap/dist/css/bootstrap.min.css",
        "../node_modules/ng2-toasty/style-bootstrap.css",
        "../node_modules/font-awesome/css/font-awesome.min.css",
        "../node_modules/primeng/resources/primeng.min.css",
        "../node_modules/primeng/resources/themes/omega/theme.css",
        "../node_modules/extra/bootstrap-switch.css",
        "../node_modules/uikit/dist/css/uikit.min.css",
        "styles.css"
      ],
      "scripts": [
        "../node_modules/jquery/dist/jquery.min.js",
        "../node_modules/uikit/dist/js/uikit.min.js",
        "../node_modules/uikit/dist/js/create_upload.js",
        "../node_modules/uikit/dist/js/uikit-icons.min.js",
        "../node_modules/tether/dist/js/tether.min.js",
        "../node_modules/extra/bootstrap-switch.js",
        "../node_modules/uikit/src/js/components/upload.js",
        "../node_modules/bootstrap/dist/js/bootstrap.min.js"
      ],

And my page looks like this;

<div class="ui-g">
              <div class="ui-g-12">
                    <label class="control-label">Foto</label>

                    <div id="upload-drop" class="bw-upload">
                      <i class="glyphicon  glyphicon-cloud-upload"></i>
                      <span>Arraste a foto aqui ou </span>
                      <a class="bw-upload-form-file">selecione <input id="upload-select" type="file" accept=".jpg,.jpeg,.png"/></a>
                    </div>
                  </div>
            </div>

The image that appears looks like this;

Anditwastobethisway;

ThecoderesponsibleforactivatingJavascriptisthis;

$(function(){varsettings={type:'json',filelimit:1,allow:'*.(jpg|jpeg|png)'};UIkit.uploadSelect($('#upload-select'),settings);UIkit.uploadDrop($('#upload-drop'),settings);});

Icreateditwiththenameofcreate_upload.jsandputitinthatpath;

"../node_modules/uikit/dist/js/create_upload.js",

I accept suggestions;

    
asked by anonymous 23.01.2018 / 15:40

0 answers