Abp Boilerplate: How to Perform client side translation? - angularjs

I am using Abp boilerplate http://aspnetboilerplate.com/
I am not able to find any documentation related to client side translation.
I tried doing it in angular way, but as the language is saved in xml in abp boilerplate template, so not sure how to perform.
Any help is very appreciated, I wasted hell lot of time in googling :(

Use
abp.localization.localize('your_key', 'your_localize')
For further info see abp.js in the [Your_project_name].Web\Abp\Framework\scripts\abp.js
Usually, 'your_localize' is equals to [Your_project_name]

there's documentation for client localization. click here for javascript localization >
Basically the steps to localize in client-side
If your page does not have included below script, you need to add the script to your html
<script src="/AbpScripts/GetScripts"
type="text/javascript"></script>
Then you can use it like this
var source = abp.localization.getSource('SimpleTaskSystem');
var s1 = source('NewTask');

Related

Pl upload library reference

I am working on some POC or code where in I am trying to integrate Pl upload to my react application.
I found very good example -
This one is very good, wrapper for listening all the events from Pl upload library.
https://github.com/lemonCMS/react-plupload
I could integrate it fine, however I noticed linking of Pl upload happened in the index.html file (Which is not ideal way.).
<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/plupload/3.1.2/plupload.full.min.js' async></script>
Need some input, how can I link same library coping inside my project directory.
So here basically I am expecting window.plupload should be initialized fine on load.
Another example I really liked is, as this will maintain state in the redux store and I hope I can navigate accross application with upload stays in progress.
https://www.npmjs.com/package/redux-plupload
However for second example as well, need some input about linking.
Also, please suggest if i am missing anything.
Thank you all.
I have figured out, I had to install, below package.
https://www.npmjs.com/package/plupload
This is not latest version, but will solve my purpose.
Thank you!

React adding animated interactive background from external script

Hi I am stuck at adding animated background to React app which is also interactive.
I've looked through few similar problems and this page https://reactjs.org/docs/integrating-with-other-libraries.html but I can't find solution to my problem.
Script is written in Java and translated to JavaScript and I've bough it. There are documentation but it not mentions React. The author of the script says he doesn't know React and cannot help me. It is working fine in normal website but I would like to adopt it to React.
The code in HTML looks like:
<script src="js/libs/jsband-min.js" type="text/javascript"></script>
<script src="js/anim-min.js" type="text/javascript"></script>
<div id="DV_ID">
<script type="text/javascript">
var anim = new Anim("DIV_ID", {
//some settings
MOUSE_IMPACT_FACTOR: 50
ETC...
}
</script>
</div>
React is just a library to generate the view (content) of a website. You should be able to use that library you want in React, but your question needs more focus/information I think. Though I'll try my best to help.
It sounds like a requirement is loading those 2 scripts. Did you already make sure to load them into your react app, and verify via the network tools both are being loaded? If the answer to that is no, this article may be of help:
https://medium.com/better-programming/4-ways-of-adding-external-js-files-in-reactjs-823f85de3668
Once you made sure both scripts are loaded by your react app, you should ask whoever made the library you are using how it works/selects the element to inject the background. As a wild guess, I'm guessing that DIV_ID is the ID of the element to inject the background with. Did you already make sure that element exists at the time the code runs? You can verify this by debugging the code, and running document.getElementById with that ID in the console and verifying it exists. If not, this could be another reason.
The last thing that could likely be, is the element may exist, but it may not have dimensions. You could probably figure this out with the DOM inspector.
Overall, I'd recommend you read the posting guidelines before your next question, since this question lacks a lot of the thing people need to help you:
https://stackoverflow.com/help/how-to-ask

How to protect my angular application?

I have created an angular application which uses web services to fetch data from my backend and also implementing other logical data based on user.
Since it is a client side application, the code will be visible for anyone and my logical functionalities. I am afraid that it is possible that anyone can find a loophole in my application.
Even if I minified my js files, there are many tools available to unminify it.
So is there any possible way to hide my js files from browser or some other way to avoid reading my code?
The only solution is you cant hide the javascript code from inspect. The maximum possible method is to minifiy the and uglify the code to make the code un readable. but still there are some other methods to hack it. Please look here for more details.

build website 'online help' with angularjs

Starting with a website build with AngularJS as frontend and a ReST API set as backend. I would like to append an online help content.
Does exist a project or a framework to do that quickly (using angularjs powerfull) ?
I have no special mandatory requirements. I think that two concept could be important:
help section representation as a tree,
quick link between webapplication and online help.
JHipser may be the one you need.
I finally decided to build it without additional framework:
a flat json file that describe the structure and contents of my online help,
a controller with $http.get(...) embedded to get back the content
a dedicated help page : I re-use the bootstrap help menu and I use the ng-repeat directive to show the active content.
(Anyway Thanks #Shaojiang Cai for your suggest).

Is AngularRoute.js is Mandatory for routing in Angular js

i am new to angular js .
Please help me.
i readed some blogs on angular views and route and i implemented the code for view and route .
the code was not working. As I include angularoute.js to code then it works fine for me .
But in all the blogs they are not including the angularoute.js to code.
So my question is that is route logic was removed from angular.js or i am doing something wrong.
In angular 1.0, routing was part of the core angular.js module. Since 1.2, they've made it an external module, in an external file. What you're doing is thus fine, and the blogs you read have probably been written before angular 1.2, or neglected to precise that this additional file had to be added.
The official documentation is quite clear about it, though:
First include angular-route.js in your HTML:
<script src="angular.js">
<script src="angular-route.js">
...
I strongly suggest you to use aungular-ui-router. Basically it's the same as angular-route but it has much much more features. There are the nested views option, also you can pass parameters over different states. You can easily assert in which state you are and based on that change the view or do something else. Another aswe feature is that you can have multiple named view on a single page which means you can load different templates on this page. The documentation is pretty awesome with this one as well. You might want to take a look. Also when you have some issues you better paste some code so people could see where could something possibly be wrong.
The Angular UI - 3rd party lib.

Resources