bigbear713 / nb-trans Goto Github PK
View Code? Open in Web Editor NEWan angular(2+) component about i18n.
Home Page: https://bigbear713.github.io/nb-trans/
License: MIT License
an angular(2+) component about i18n.
Home Page: https://bigbear713.github.io/nb-trans/
License: MIT License
version: v16.0.0
The lib support the template with params, like This is a {{param1}}
, and the {{param1}}
with be replaced as param value.
Now it is handled by RegExp, it is ok now, but it's a bit complicated. I think we can simplify the process, using a third-party lib to do it.
The lodash you know is a powful third-party lib, and provide template()
to handle template string. I think we can try to use it to help us to handle the translated string, we only need to provide the translated string and params value. It can make the process be more simple.
Of course, it's not always the best way, so try it and discuss it
version: v15.1.0
We know in translated statement, if a prev param value contains the next param key, there is a problem when using the prev param value to replace the corresponding param key.
// translated statement
const transStr = 'this is {{p1}}, this is {{p2}}';
// param value
const params={
p1:'{{p2}}',
p2:'param value 2',
};
// replace param key '{{p1}}' as param value '{{p2}}'
const transStrTmp = 'this is {{p2}}, this is {{p2}}';
// replace param key '{{p2}}' as param value 'param value 2'
const wrongResult = 'this is param value 2, this is param value 2';
// what we want
const rightResult = 'this is {{p2}}, this is param value 2';
So now using uuid to replace all param key in translated statement firstly, then using param values to replace the param keys corresponding uuid value in statement.
But so we have to import uuid
lib. I think it is better if here can use Symbol to replace uuid
, because the uuid
lib can give us unique values, and the Symbol also can be unique
version: v16.0.0
The Angular v17
will be released soon, so the lib is going to be upgraded to v17.0.0
which based on Angular 16
I think it is better when there are some comment about function in NbTransService. So we can know what the function will do easier and not need to view the document
version: 13.0.1
The ng14 has been published: https://github.com/angular/angular/releases/tag/14.0.0
The lib is going to be upgraded to v14.0.0 which based on Angular 14
I think it is better if there is a new web project to test ssr case, because we can make codes clearer and try more cases
version: v15.1.0
The Angular v16
will be released soon, so the lib is going to be upgraded to v16.0.0
which based on Angular 16
The changelog document link is error in demo website
version: v15.1.0
Now it is only support the format: {{param1}}
, the param key and {{}} can't have spaces between them, it is inconvenient.
It is better if it can support the format: {{ param1 }}
, the param key and {{}} can have spaces between them.
Update the demo website based on v17
version
: 15.0.0
I think the names of NbTransLangEnum
, NB_TRANS_MAX_RETRY_TOKEN
and NbTransSentenceItemEnum
are not good, so I will rename them in the v15.0.0
.
The "Enum" is redundant in NbTransLangEnum
and NbTransSentenceItemEnum
, so I will remove it;
NB_TRANS_MAX_RETRY_TOKEN
does not meet rules, the "_TOKEN" will be removed
version: v15.1.0
When the key value is incomplete, the translated result is an object data, not a string data. Like this:
In translations.json
{
"level1":{
"level2":{
"level3":"hello world"
}
}
}
In template:
<div>{{'level1.level2'|nbTrans}}</div>
Then the content in page is
<div>[object Object]</div>
Because the trans key is level1.level2
which is incomplete, so the result is object data: { "level3":"hello world" }
The complete key is level1.level2.level3
,and the expected result is hello world
version: v15.2.0
Now when we want to render a complex content, we can use <nb-trans></nb-trans>
component. By there will always have a nb-trans
tag, it is not good in some scenarios, such as setting style via html tag. So I hope the nb-trans
tag can be non-existent when I need.
The default branch has been renamed as 'main', but the link containing old branch name (master) has not been updated in documents.
So let's update them as new default branch name
Update readme markdown and change log markdown documents.
Remove errors and add some links
Add Google Analytics to the demo website, and tracking some information
v13.0.0
@bigbear713/nb-common
is ^12.1.0
in package.json, but it is base on ng13, so here is invalid** version **: v15.1.0
When the translation string and options like this:
// translation.json
{
"sentence": "This is {{p1}} and {{p2}}"
}
const options={
params:{
"p1":"{{p2}}",
"p2": '123'
}
};
The expected result is: This is {{p2}} and 123
, and the trans result is right when using nbTrans pipe.
But It is wrong when using component and the wrong result is: This is 123 and 123
version: 14.0.0
The ng15 has been published: https://github.com/angular/angular/releases/tag/15.0.0
The lib is going to be upgraded to v15.0.0 which based on Angular 15
As we all know the Eslint and prettier are useful when we working with others, but now it is missing for the project. So let's add the Eslint and Prettier to the project
version: v15.0.0
Now the components can be used in standalone components, but should import the NbTransModule
first, someone may think using module is not good in standalone component, it is better when the import is all components, although it has no effect on the size of the packed file.
And I think it is ok to import the components as standalone mode, so I will support it
version: 12.1.0
The lib is going to be upgraded to v13.0.0 which based on Angular 13
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.