如何模板化数据到Ajax版Smart Admin主题？

Question

我正在为客户端构建一个应用程序，我在后端使用 Laravel5 开发 Web 服务，我将使用 Smart Admin Theme，尤其是 Ajax 使用它版本。

我已经使用过该主题的 HTML 版本，但我仍在使用 Laravel 作为后端。我可以简单地使用 Laravel 提供的 Blade 模板引擎并将数据注入视图。

但现在我将使用 Ajax 版本，我应该如何将数据模板化到视图中。我可以请求网络服务获取数据，它会以 JSON 格式 return。这部分对我来说很清楚，因为我以前做过。

大多数小部件都有内置集成，例如 jquery 数据表和主题中使用的完整日历库。我可以看到数据将被注入这里，但是论坛和其他东西呢？我应该使用 Jquery 来操纵 DOM 还是有更好的方法。

Angular 提供了一种方法，我可以通过两种方式绑定传入数据，我可以使用 ng-repeat 将其注入表和无序列表，但我将如何在此处完成此操作。有没有我可以使用的模板系统？

Answer 1

我知道到目前为止您一直在使用 Laravel 为您渲染 HTML。现在您希望 HTML/JS 站点托管在其他计算机上，并通过 API.

从 Laravel 获取所有动态值

如果是这种情况，那么您确实需要自己实现所有动态功能，这是一项相当大的工作。

您也可以使用相同的 laravel 应用程序，让它在站点的一部分为您的静态 HTML/JS 服务，您将通过 API 从后端调用值并保留其他部分您让 Laravel 呈现不需要 API 来获取其动态值的 HTML 的网站 "normal"。

Answer 2

这个答案最初是评论，后来变成了答案..

如果您使用 angular，最好的方法是将模板保留在 angular 应用程序上并从 api 获取数据。在你的情况下 Laravel 将是你的 API。

您将使用 JWT（JSON 网络令牌）等身份验证方法通过 API 从服务器进行身份验证和获取数据。这在 Laravel.

上很容易做到

所有数据都将作为 json 接收，并且可以使用 angular 轻松呈现到客户端浏览器上的模板上。你不需要 jQuery，你可以使用 Angular 指令 bootstrap (angular-strap)。

我没有检查这个主题。但是，如果它不是使用 angular 指令编写的，那么您将很难使用客户端模板呈现数据。

Answer 3

感谢您的回答，但遗憾的是我无法理解这些问题。尽管如此，我还是感谢您的意见。

最后我求助于 rivet.js 库。这个库为构建现代 Web 应用程序提供了轻量级和强大的数据绑定 + 模板解决方案。

他们有很好的 documentation 来帮助开发。

现在我可以简单地将数据模板化到像 { data.someAttribute } 这样的视图中，就像下面的代码片段一样：

<section id="auction">
  <h3>{ auction.product.name }</h3>
  <p>Current bid: { auction.currentBid | money }</p>

  <aside rv-if="auction.timeLeft | lt 120">
    Hurry up! There is { auction.timeLeft | time } left.
  </aside>
</section>

然后我可以简单地将 section#auction 标签与拍卖 JSON 对象绑定，如下所示：

rivets.bind($('#auction'), {auction: auction})

这使得从服务器获取数据并将数据模板化到视图中变得非常容易。现在移动应用程序最终可以使用相同的后端 Web 服务。

我希望这对某人有所帮助。 :)

如何模板化数据到Ajax版Smart Admin主题？

How to template data into the Ajax version of Smart Admin theme?

javascript

jquery

ajax

laravel-5

smartadmin