How do I declare dropZone element in AngularJS version of File Upload? - angularjs

Using AngularJS version of File Upload (https://blueimp.github.io/jQuery-File-Upload/angularjs.html) I'm trying to figure out how I can declare dropZone via HTML attributes - an equivalent of:
$(el).fileupload({
dropZone: $('.dropZone', this)
})

On their wiki section they list an angular directive as a fork.
If you go to their usage section on their github repository, you will see that they had created a directive you can use this way:
<ng-upload-form url="//jquery-file-upload.appspot.com/" auto-upload="true" size-limit="500000"></ng-upload-form>
I think that should help you.

Related

Add javascript file at the end of the script block

i am using cakephp 3.7 and i load few .js file in my default.ctp layout. The problems comes when i try to add other .js in my view. These js files are added at the beginning of the js file list.
I do echo $this->fetch('script'); to print that block.
For example, i am using jquery, i load this library in default.ctp because i use it everywhere, the problem is that view js are loaded before jquery so i cannot use $
how can i "append" to script block, inside an action's view?
Thanks
In your layout put (before < /head> if you wish)
$this->fetch('my_head_script')
, then in your view use
$this->Html->script("jquery.js",['block' => 'my_head_script']);
Did You use script blocks, described here: https://book.cakephp.org/3.0/en/views/helpers/html.html#creating-inline-javascript-blocks?

Angularjs, how to structure my code across multiple files

I'm new to AngularJS and have a question regarding the structure of AngularJS.
Here is a simple working Plunker example I was working on, which displays the map.
So my question is:
how do you separate out <mapbox callback="callback"></mapbox> if I want to create a file in the view folder instead of putting it into app.js?
I have tried creating a show.html file inside of my view folder and pasted that line of code, but it didn't work.
Should I change 'template': '<mapbox callback="callback"></mapbox>' to
templateUrl: 'views/show.html'?
Your help is greatly appreciated.
Yes. I slightly modified your plunker to show how can you can do it.
http://plnkr.co/edit/Fpst5cd6gfIh30eOk447
Basically, what I did there was to create a new html file, name it mapbox.html and paste the html template there from app.js. Afterwards, I edited the app.js config block to use the templateUrl property pointing to the new file above and deleted the template property one, et voilĂ !

MVC, Render HTML page which includes AngularJS

I have a site build in MVC5 and C#. In this site I have a view (public.cshtml). In this view I have some text and beneith this text I would like to render another view (angular.html). The anguar.html view contains some angular script. How do I render the html page in the cshtml page correctly? Or is it even possible?
I have tried using Partial, RenderPartial and RenderPage but with no succes.
Any help is appreciated! Thanks in advance.
It depends on whether your public.cshtml is "covered" with ngApp or all angular-related stuff is in that "angular.html".
If it's the first, you could use ng-include:
<ng-include src="'/...'"></ng-include>
if it's the latter, you could use #Html.Raw(), like this
#Html.Raw(File.ReadAllText(Server.MapPath("~/...")))
where "..." is your relative path to angular.html.

How to use AngularJS directive for WURFL img-wit with ng-src?

http://www.scientiamobile.com/page/angularwit
Want to be able to do something like this:
<img-wit ng-src="{{trustSrc(profile.pic)}}" w="100"/>
The picture isn't rendering however, although the blank space is sized correctly. Is it possible to use angular directive version of img-wit with ng-src?
UPDATE:
Determined the easiest way to use img-wit is not to implement angularjs directive at all. Instead, just append appropriate img-wit link prefix inside controller.
Support to ngSrc directive has been added in the 0.9.1 version: https://github.com/WURFL/angular-wurfl-image-tailor/releases/tag/0.9.1.
Syntax like the follow is now supported:
<img-wit ng-src="{{myUrl}}"></img-wit>
where {{myUrl}} is the url of the trusted image to load.
Please check https://github.com/WURFL/angular-wurfl-image-tailor#how-to-use-it for further details.
Disclaimer: I work for ScientiaMobile

AngularJS - parameters in css files

I'm currently migrating from custom framework to Angular. Since we've got legacy, all front-end resources like stylescheets, images and scripts should be located on a subdomain, and all urls should be absolute. I've got a bunch of css files with a parameter specifying our static domain. I'm looking for a native Angular approach to using parameters in css, so I'll be able to write smth like:
.body {background: "{{domain}}/img/bg.png";}
Currently in our framework styles are loaded with, say, $http.get(), then processed with .replace and then appended to DOM.
Any ideas?
Thank you.
Try the $interpolate service. Inject it in a method, then use like this:
var fn = $interpolate(cssText);
var processedCssText = fn(scope); // scope is whatever obj that contains `domain` and other properties that might be used inside cssText
You can even configure the opening & closing symbols, if needed. See the documentation for $interpolate for more information.
You want LESS.
http://lesscss.org
It's the "dynamic stylesheet language".

Resources