angular 2 and Thymeleaf

[yuting...@gmail.com]

I'm trying to embed angular 2 with Thymeleaf, since there will be too much work to replace Thymeleaf.

But it seems like the th: from Thymeleaf can not be complied if I put it in the template in the .ts file.

Anyone know how to solve this problem?

[yuting...@gmail.com]

No one answer my question :(

[Sander Elias]

Hi Yuting...,

So, if I understand your question right, you are wondering why your server does not render a th: construct you are putting into the DOM inside your client-side part of your application?

Regards

Sander

[yuting...@gmail.com]

Thank you, Sander! Yes. 

This is the .ts file: 

import {Component, NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'


@Component({
     selector: 'my-app',
     template: `
     <table xmlns:th="http://www.w3.org/1999/xhtml">
         <tbody>
            <tr>
                <th>User Name</th>
                <th th:each="role : ${roles}">
                   <div class="row">
                       <div th:text="${role.type}"></div>
                   </div>
                </th>
            </tr>
        </tbody>
    </table>`,
    })
export class App {}

[Sander Elias]

Ok...

Well, you can't do it like that. As I noticed in my question, this is not HTML before the scripts are executed in the browser. So it is NOT AVAILABLE to your server at all, as it does not exist at the time the server does it job. You need to provide a rest (or other) endpoint in your server so you can use http to get the data inside the client.

Regards

Sander

 

[yuting...@gmail.com]

I'm pretty new to Angular2. Can you give me a little bit more help about what should I do for the rest endpoint? Maybe use th:include or th:repalce?

Thank you so much!!

Yuting

[Sander Elias]

Hi Yuting,

I'm sorry, but I'm apparently unable to help you. Somehow I fail to communicate to you that it's impossible to use server-side constructs inside the browser.

Regards

Sander