Thanks everyone! Since my institution (the University of Ottawa in
Ontario, Canada) is a bilingual university, it's best practice for us to
have independent views in each language--otherwise, our webpages get very
bulky with the duplication of text.
Adding the translation works fine on the home-news.component.html, but when
I try to do something similar in my created components, ie:
<div class="container">
<div class="row panel">
<div class="col-md-12">
<h3>
{{ 'uoresearch.head' | translate }}
</h3>
<div class="panel content">
</div>
</div>
</div>
</div>
I end up getting
error NG8004: No pipe found with name 'translate'.
What could be causing this? I assume when the existing components call the
default components (ie: import { HomePageComponent as BaseComponent } from
'../../../../app/home-page/home-page.component';), it's linking to
something that calls the ngx translate module, but I can't figure out
what's going on.
On Friday, October 6, 2023 at 11:46:43 AM UTC-4 [email protected] wrote:
> Carolyn, you could just place both the English and French text in your
> home-news.component.html file, and bypass the i18n stuff. Certainly not as
> elegant as having it switch based on the selected language, but it is
> easier. All the email I get from the Government of Canada just have both
> languages like that. :)
>
> DSpace does seem to set the lang attribute of the html tag to the
> selected language, so perhaps there's some fancy CSS you could do to
> show/hide the French and English sections based on the "fr" or "en" values
> there. I don't know if that's any less work than the i18n method, but it
> would give the appearance of being dynamic.
>
> - Darryl
>
> On Tuesday, October 3, 2023 at 8:11:18 AM UTC-6 Carolyn Sullivan wrote:
>
>> Thank you all so much for your responses! This is super helpful in terms
>> of learning more about customize the interface, and gives me some direction
>> for issues I need to be aware of (like figuring out an alternative to
>> tweaking code outside the theme). One more question: My institution,
>> uOttawa, is fully bilingual, which means all the text needs to be
>> translated to both French and English. I think that means that material
>> like the text on the home-news.component.html page needs to be defined in
>> the i18n page, but part of me balks at the idea of adding 1000-word
>> definitions for labels... is there any other dynamic/Angular way of doing
>> this, or is this, in fact, the way it's done?
>>
>> Thanks,
>> Carolyn.
>>
>> On Monday, October 2, 2023 at 2:00:52 PM UTC-4 [email protected] wrote:
>>
>>> Our implementation looks very similar to Mark's. We created 2
>>> additional components in the app/info directory of our theme, one for
>>> an About component and one for a Guidelines component. I started by just
>>> copying one of the existing "feedback" or "privacy" directories (I forget
>>> which one I used, but either will work) then changed the filename names,
>>> content, selectors etc. I modified lazy-theme.module.ts in my theme
>>> folder to import my 2 new components. This seems to mimic what Mark did
>>> according to that diff in Slack.
>>>
>>> Where Mark and I differ is how I added those 2 components to DSpace. We
>>> wanted an About menu at the start of the nav bar with a dropdown for our
>>> About and Guidelines pages, and wanted the URLs to be like the Feedback URL
>>> (/info/feedback) i.e. /info/about and /info/guidelines. To do this I
>>> modified the core /src/app/info/info-routing.module.ts and imported my
>>> 2 components there and added this right below the existing FEEDBACK_PATH
>>> path (around line 20)
>>>
>>> {
>>> path: 'about',
>>> component: AboutComponent,
>>> resolve: { breadcrumb: I18nBreadcrumbResolver },
>>> data: { title: 'info.about.title', breadcrumbKey: 'info.about' },
>>> },
>>> {
>>> path: 'guidelines',
>>> component: GuidelinesComponent,
>>> resolve: { breadcrumb: I18nBreadcrumbResolver },
>>> data: { title: 'info.guidelines.title', breadcrumbKey:
>>> 'info.guidelines' },
>>> }
>>>
>>> To add my About menu and the dropdown options (this may not be needed
>>> for 7.6 as I think there have been some additional themable components
>>> added related to the nav bar; I did this in 7.4 initially) I added this
>>> section to /src/app/menu.resolver.ts at about line 96 (i.e I inserted
>>> these as the very first entries in the menuList array in
>>> createPublicMenu, right before the existing Communities and Collections
>>> element)
>>>
>>> /* About */
>>> {
>>> id: `about_about`,
>>> parentID: 'about',
>>> active: false,
>>> visible: true,
>>> model: {
>>> type: MenuItemType.LINK,
>>> text: `info.about.title`,
>>> link: `/info/about`
>>> } as LinkMenuItemModel
>>> },
>>> {
>>> id: `about_guidelines`,
>>> parentID: 'about',
>>> active: false,
>>> visible: true,
>>> model: {
>>> type: MenuItemType.LINK,
>>> text: `info.guidelines.title`,
>>> link: `/info/guidelines`
>>> } as LinkMenuItemModel
>>> },
>>> {
>>> id: 'about',
>>> active: false,
>>> visible: true,
>>> index: 0,
>>> model: {
>>> type: MenuItemType.TEXT,
>>> text: 'menu.section.about'
>>> } as TextMenuItemModel,
>>> },
>>>
>>>
>>> I don't like having to modify code outside of the theme, but I was in a
>>> bit of a rush to get this working. I think 7.6 made some additional nav
>>> related stuff themable so I might be able to undo that last modification.
>>> I haven't actually investigated that yet.
>>>
>>> - Darryl
>>>
>>>
>>> On Monday, October 2, 2023 at 9:51:09 AM UTC-6 Carolyn Sullivan wrote:
>>>
>>>> Oh wait, I see Mark has helpfully shared his code in the DSpace Slack:
>>>> https://dspace-org.slack.com/archives/C3TTSEB1V/p1694715563285319
>>>>
>>>> The changes aren't working in my repo so far, but this gives me a good
>>>> starting point--thanks Mark!
>>>>
>>>> On Monday, October 2, 2023 at 9:43:43 AM UTC-4 Carolyn Sullivan wrote:
>>>>
>>>>> Hello,
>>>>>
>>>>> Thank you for opening this thread. I have the same problem as Mariusz
>>>>> originally did, and was wondering if anyone could offer some more
>>>>> specific
>>>>> recommendations regarding Mark Wood's solution.
>>>>>
>>>>> On our repository, we added an additional link to the navbar menu like
>>>>> so:
>>>>>
>>>>> <li ngbDropdown class="nav-item d-flex align-items-center">
>>>>> <a class="nav-link " role="button" data-toggle="dropdown"
>>>>> aria-expanded="false" ngbDropdownToggle> About </a>
>>>>> <div ngbDropdownMenu class="m-0 border-top-0 ng-trigger
>>>>> ng-trigger-slide shadow-none" id="customDrop">
>>>>> <a ngbDropdownItem style="color: #207698"
>>>>> href="assets/about/uo-research.html">UO-Research</a>
>>>>> <a ngbDropdownItem style="color: #207698"
>>>>> href="assets/about/policies.html">Policies</a>
>>>>> <a ngbDropdownItem style="color: #207698"
>>>>> href="assets/about/faq.html">FAQ</a>
>>>>> </div>
>>>>> </li>
>>>>>
>>>>> To use this structure but have it link to a view with the DSpace
>>>>> header/footer and text content sandwiched between, would we then create a
>>>>> component in our custom/app folder, and then use a routing
>>>>> module/routerlink to get to that component view instead of using the
>>>>> static
>>>>> link here (https://angular.io/tutorial/tour-of-heroes/toh-pt5)? Is
>>>>> that the simplest way of doing it?
>>>>>
>>>>> Thanks,
>>>>> Carolyn.
>>>>>
>>>>>
>>>>> On Friday, June 10, 2022 at 8:39:52 AM UTC-4 Mariusz wrote:
>>>>>
>>>>>> It enlightened me and I have done it in the meantime. I just doubled
>>>>>> the privacy component accordingly. Managed to. It works. But thanks for
>>>>>> any
>>>>>> suggestions.
>>>>>>
>>>>>> Regards
>>>>>> Mariusz
>>>>>>
>>>>>> piątek, 10 czerwca 2022 o 14:25:27 UTC+2 [email protected]
>>>>>> napisał(a):
>>>>>>
>>>>>>> On Fri, Jun 10, 2022 at 02:35:00AM -0700, Mariusz wrote:
>>>>>>> > It works, but how can I make static pages look like the rest. I
>>>>>>> would like
>>>>>>> > a page with static content that looks like other pages in my
>>>>>>> repository. I
>>>>>>> > have already created my own theme. I would like to have additional
>>>>>>> (themed)
>>>>>>> > pages with my permanent content, as now they have info/privacy
>>>>>>> (Privacy
>>>>>>> > Statement) or info/end-user-agreement (End User Agreement) . Pages
>>>>>>> with my
>>>>>>> > own info. I don't know if I'm explaining well. ;)
>>>>>>>
>>>>>>> So, I think you are saying that you want a page with all of the
>>>>>>> common
>>>>>>> DSpace decorations, behaviors and styling, but with static content
>>>>>>> in
>>>>>>> the middle. That does not sound like a static page, but a dynamic
>>>>>>> page with fixed main content. I think that, to do this, you would
>>>>>>> just write a component whose HTML template file contains no
>>>>>>> placeholders and whose Typescript file contains no behaviors. Use
>>>>>>> the
>>>>>>> theme's styling classes so that the rendering of your component
>>>>>>> tracks
>>>>>>> changes to the theme.
>>>>>>>
>>>>>>> The "page" is assembled by Angular in the browser, and the stuff in
>>>>>>> the middle that changes as you navigate is just one part of the
>>>>>>> assembly. https://en.wikipedia.org/wiki/Single-page_application
>>>>>>>
>>>>>>> --
>>>>>>> Mark H. Wood
>>>>>>> Lead Technology Analyst
>>>>>>>
>>>>>>> University Library
>>>>>>> Indiana University - Purdue University Indianapolis
>>>>>>> 755 W. Michigan Street
>>>>>>> Indianapolis, IN 46202
>>>>>>> 317-274-0749 <(317)%20274-0749>
>>>>>>> www.ulib.iupui.edu
>>>>>>>
>>>>>>
--
All messages to this mailing list should adhere to the Code of Conduct:
https://www.lyrasis.org/about/Pages/Code-of-Conduct.aspx
---
You received this message because you are subscribed to the Google Groups
"DSpace Community" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/dspace-community/ac1021e4-49cf-41d3-aa6a-7f03eb7b4213n%40googlegroups.com.
