Does cloning in angular-dragdrop work? - angularjs

The angular-dragdrop examples contain the following example:
"Shopping card with cloning"
Only it doesn't clone.
And it seems to be a reimplementation of this example:
http://jqueryui.com/droppable/#shopping-cart
Which does clone.
So is the takeaway that this functionality just doesn't exist in angular-dragdrop?

In order to enable cloning you need to set
jqyoui-draggable="{placeholder:'keep'}"
AND
data-jqyoui-options="{helper:'clone'}"
without the helper cloning doesn't work.
If you take a look at the example's code (http://codef0rmer.github.io/angular-dragdrop/#/cart) you will see that he sets both attributes. Unfortunately it isn't mentioned in the docs.

You could try angular-dragon-drop which supports cloning.

Related

Can I use the "?." syntax in react?

I come from Angular where there you have the possibility of calling a property like this: object?.property.
If the object is null your app then not breaks down but it performs like an inline if-statement. As far as I know it is angular specific.
Does anyone know how this "ternary" is called?
Can one use this syntax in React?
Help would be appreciated
Yes the same is called Optional chaining operator. It is not angular specific. In case your react app uses typescript with a version 3.7 and above, you might as well go ahead and use it.
Check these articles as well :
https://dev.to/akirautio/optional-chaining-with-react-2l28
How to enable optional chaining with Create React App and TypeScript
Usage something like this:
let author = book?.author?.name;
This is a feature coming up in one of the next versions of ECMAScript. You can already use this, but you will need change some configurations to be able to use it. See the article by John Au-Yeung here: https://dev.to/aumayeung/how-to-use-the-optional-chaining-operator-in-your-react-app-right-now-1ocj

withState vs. withStateHandlers

The docs # https://github.com/acdlite/recompose/blob/master/docs/API.md#withstate says this regarding withState
You'll likely want to use this state updater along with withHandlers()
to create specific updater functions.
Then it has a separate function withStateHandlers() which seems similar though in a slightly different form.
In terms of practical use and why one would be used instead of the other, how do they differ?
Actually withStateHandlers() hasn't appeared until recently version of recompose. I'd recommend that use withStateHandlers() instead of combining withState() and withHandlers() if you can.
The doc under withState() probably need update.

Ng2-Admin-using exists components

I am new to angular 2/4,and I am trying to use ng2-admin as a base, and trying to build on to of it a full dash board includes beck-end.
I am facing lots of issues while trying to use exist component(such as basic table) in a new simple module. I can't find any detailed documentation on ng2-admin beside creating new page.
Is there anyone who can guide me please?
Thanks
Never mind, i found the solution 😀
what actually i did was to redefine the Declarations/Providers correctly.
when using "ng" to generate new things,it is also adding unnecessary deceleration in some places so this was my first mistake,also some used providers/services was needed to be declared on the right module.after understanding how the structure should be ,i kept the rules and i was able to add what i needed without any issues.

Prefixing inline styles in an isomorphic react app

Are there any simple ways to patch React to autoprefix styles, such that the rendered HTML doesn't differ on the client and server?
For example, is it possible to get
<div style={{display: 'flex'}}/>
to render to (ignoring data-reactid):
<div style="display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;"/>
In the specific case you posted, you may have to make a function in which you pass your style and it creates the correct styles. In cases where a simple prefix will work, you could use something like react-prefixr which just adds ms,Webkit,etc. to the style structure. If display:flex is not handled properly by react-prefixr, you can probably submit it as PR.
I've had the same issue and wanted an easy way to mixin styles. So I created a library that lets you use less/sass style mixins https://seogrady.github.io/style-mixin.
I've just today created a simple prefixing tool, react-prefixer. This handles prefixing possibilities for relevant browsers.
I say relevant because you call out display:-webkit-box syntax, which is basically Safari 5.1, its pretty non-existent these days. Additionally, it only adds the syntax needed, meaning you won't see the full string of styles as you showed ... based on browser support, it will either provide the prefixed version or the spec version, no need to clog up the markup with useless styles.
It's still pretty young (I coded it this morning), but maybe it can help.

C: dependency analysis of functions

Is there a tool where I can give a file + function name as an input and it gives me all functions the given function depends on and the same for all the found functions, and so on within my codebase?
Something like this would help a lot in extracting functionality from existing codebases.
You could use doxygen with dot to create a call graph -- it should work fine even without doxygen annotations in the comments.
See some samples of it here.
See this discussion.
I don't know of a standalone tool that will do this. However it is a supported feature of certain IDE's such as Source Insight
http://www.sourceinsight.com/
Source Navigator is a free tool that includes this functionality:
http://sourcenav.sourceforge.net/
cxref should do what you ask for.

Resources