I am using a MEAN stack (mongodb, express, angular, nodejs) to develop an application. To render HTML in different languages I am using the i18n-2 node module.
But, I have some front end error messages (like validation errors - eg. Invalid Email). These messages appear based on user actions. How can these messages be internationalized?
One approach I can think of is to use hidden elements in jade / html and then pull out the same in angular / javascript. Alternatively, I can pass some ng-init variables in the jade file and then pull out the appropriate message at runtime in the angular controller.
Is the above approach ok? Or is there any other best practice for this?
Take a look at the Angular Translate module:
http://angular-translate.github.io/
Take a look at the Angular Auto Validate module:
http://jonsamwell.github.io/angular-auto-validate/
You could combine it with the Angular Translate module and create a custom error message resolver.
Related
I am trying to integrate ejs to a express and web pack dev server project, and I am unable to do so because even though I am passing my variables, they are loading like this
Html Webpack Plugin:
ReferenceError: name is not defined
- index.ejs:102 ./node_modules/html-webpack-plugin/lib/loader.js!./src/templates/views/index.ejs.module.exports
C:/Users/arora/OneDrive/Documents/Rishab/Projects/Webpress/src/templates/views/index.ejs:102:11
- index.js:284
[Webpress]/[html-webpack-plugin]/index.js:284:18
- task_queues.js:93 processTicksAndRejections
internal/process/task_queues.js:93:5
This Error is in the console. Please help, here is the code link. Thanks in advance.
When webpack compiles your ejs to HTML it has no local variables passed to the template, and so you get this error. If you know the variables in advance you can likely pass these as options in webpack --- see ejs-html-loader.
If you're want to still use variables passed to the page via ejs you will want to use a separate "template" ejs file that is really barebones --- just to pass data into <script>.
If you want to continue passing variables into your "html" of the page you will need to use some sort of ejs loader keep the ejs output in some fashion, which might limit your options on what loaders you can use for other webpack optimizations.
I'm currently trying to build an Angular2 prototype (based on alpha44) of our Angular1 app (pretty complex one) and I'm trying to find the best model/data architecture when using routes and child routes.
In my example, from a child component created from a route, I want to access a property of the parent component (hosting the router-outlet).
But when you create a component from a router-outlet, you cannot use #Input and #Output anymore.
So what is the best practice to inject some data/properties, except basic routeParams and static routeData?
How do you communicate with the parent component without too much coupling?
You can use RouteData in order to pass data into routes. See here and here. I'm still missing the part of initialising this data obj from the component (see my question regarding)
A shared service can be used with components added by the router. For details see https://angular.io/docs/ts/latest/cookbook/component-communication.html
data support also was added to the new router in RC.4. For details see How do I pass data in Angular 2 components while using Routing?
Angular 2 - equivalent to router resolve data for new router might also be related.
You can pass (inject) data from child component inside Router Outlet to Parent component with Subject,Observable. You can found my solution in this video.
See the code on GitHub: https://github.com/tabvn/angular-blog
In my nwjs application i am using React to build my UI. Currently, React is being loaded via a <script> tag in the main file, index.html. index.html has another <script> tag which loads main.js containing code which defines and renders my React components as well as requiring (require()) a few Node modules such as "fs" and "McFly".
This all seems to be working, however when i try using another node module (react-inlinesvg) i get an error, "document is undefined".
Having looked online for help, i have come to the conclusion that React now believes that it is being run on the server? Which is odd, as before i started using the react-inlinesvg module it was happily rendering components using React.render (clientside rendering).
If you need any more context or information then please ask.
It could be that you are rendering on the server side, or also that you are rendering both sides. In the second case you could simple nest the line that is causing you error with:
if (process.env.BROWSER) {
the line causing the error
}
If the error disappears, it means that you are on the server side also!
I hope this helps...
Basically if you code is universal (or isomorphic, if you want...) with this check you can execute the code only on client side, you want to do this to use a particular style-sheet for example:
if (process.env.BROWSER) {
require("../style/main.scss");
}
Naturally if you want to do stuff server-side you can check
if (!process.env.BROWSER) {
}
if any one face this he can solve it in 2 ways:
Solution 1: if you are using nw.js 15 or above try to enable mix context mode:
in your package.json add this flag:
"chromium-args": "--mixed-context"
Solution 2: expose document to the global object using this hack:
global.document = window.document;
I am working on node from last 2-3 months on a project. Now I want to handle errors from a single point in node. For example : I have several api functions in my project. Many of them are taking _id as an api input. I need to parse this id using mongoose objectid before using in query. Now if the format of _id is not valid, it will throw the casting error. It could be handled by mongoose object isvalid property. But my purpose is that, at any place if it is not handled in code I want to catch the error and log it to my log file and send a common message like 'error occurs' to the UI. I want to add a common error handler for all the api that do the logging and error handling for my api, like we use .net MVC - error handler filer through the application.
I have tried using domain. But in domain.on('error',func(err){}); it is not working. I put my api functions call in domain.run();
If any body have any suggestion for me, please let me know.
Take a look at the domain module, if your app powered by express you can use the package - express-domain-middleware
I've been following along with the book Discover Meteor from https://www.discovermeteor.com/ and I have built the tutorial project called 'Microscope'
This uses iron-router and Meteor templating system to render out the front-end. I want to redo this project using famo.us for the front-end but I am unclear on how I to do so.
I am aware of a package called famono. mrt add famono. Using this package I can integrate famo.us and draw surface to the screen in a meteor project. It also allows you to render templates to the screen.
But I am confused on how to redo the project so the router - routes to render a famous surface with the data.
Also I am wondering if the templates will still be reactive.
If someone could provide insight on how to redo the 'Microscope' project to use famo.us on the front-end I would greatly appreciate it!
Thanks
UPDATE (to be more specific)
I have been trying to figure out how to integrate famous with templates and routing, and I have no clue how to do it.
I use iron-router to handle my routing which chooses which template and data to render like so:
Router.map ->
#route 'posts',
path: '/',
data: ->
Posts.findOne()
So this will load up the posts template with Posts.findOne() data.
But I know with famous I can generate surfaces from templates on the front end like so:
background = new Surface
template: Template.post
data: ??? (Posts.findOne()) ???
mainContext.add(background)
Because javascript is what is going to load the final template into the view, what is the recommended way for me to get the data for that template, should I query the database from the front-end by setting up special subscriptions?
Typically I render the data into the page from the router on the server but...
with famous, I just have to load the main template and let famous load the rest of the templates. The only thing left is getting the data for the other templates. What is recommended?
I would start by looking at https://github.com/gadicc/meteor-famous-components/. That package will do all the work for you if you want.
I have never used the Surface template argument but I believe that is a one time load and will not update on data invalidation (data change).
Or u can take a look at working examples )
https://github.com/sayawan?tab=repositories