I am developing an Angular app that has multiple language support. The
key-value collection for the active language is loaded from API by a
dedicated TextBank service.
I am struggling with an architecture decision, don't want to discover I've
chosen the wrong way when the project is already well developed. The
decision at hand is how to insert the language-dependent text snippets in
the templates.
The obvious way is to inject the service into component and then use
template expressions to insert the text. The service knows from its config
the active language and can serve the respective text string:
import { Component } from '@angular/core';
import { TextBankService } from '../services';
@Component({
selector: 'my-component',
template: `
<div>
{{ txb.text("myKey") }}
</div>
`
})
export class MyComponent {
constructor(
private txb: TextBankService
) {}
}
However, I'd like to give some users a special permission to edit the
language-dependent text snippets. I think that in-place editing would be
the most natural in most cases. So, the text snippet references in the
templates could be a dedicated component:
import { Component } from '@angular/core';
import { TextBankComponent } from '../ui';
@Component({
selector: 'my-component',
template: `
<div>
<txb key="myKey"/>
</div>
`
})
export class MyComponent {
constructor(
) {}
}
The TextBankComponent would use TextBankService to retrieve the required
text strings. The TextBankComponent would also be aware of the user's
special permission and allow in-place editing of the instances all over the
page. The component code would seamlessly save the edited string values
using API.
>From the functionality point of view, the dedicated component approach has
more features than using simple template expression. What I am afraid of,
is that choosing the dedicated component way could be too much a load on
the browser, when there are hundred or more instances on the page. That
would result in slow page loading and memory hogging.
So, thus the question in subject: what is the reasonable maximum number of
components on a page? Of course, depends on the component complexity,
user's computer power, memory size, etc, etc. But perhaps there's some good
rule of thumb.
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.