根据保存在数据库中的设置呈现动态用户界面答案

【问题标题】：Rendering dynamic user interface depending on the settings saved in database根据保存在数据库中的设置呈现动态用户界面
【发布时间】：2014-03-18 18:01:20
【问题描述】：

我有一个情况。

我有一个设置页面，通过它我可以修改用户界面页面的设置。

此设置页面包含有关要在用户界面页面中显示的颜色和图像的信息。

当我在此设置页面中进行更改并保存时，配置将保存在数据库中。

现在我想在 DB 中使用这些保存的设置来呈现客户端 UI。

HTML 页面将保持通用，根据保存在 DB 中的设置，我需要更新其界面。

【问题讨论】：

你能提供一个 plunker 或给我们详细说明你在寻找什么样的变化？你想改变类，imagesURLs...吗？
是的，类属性应该改变，imageURLs也应该改变，具体取决于数据库中保存的配置

标签： java javascript html css angularjs

【解决方案1】：

您与控制器绑定的所有内容都可以轻松更改...

例如，您可以使用ng-class 来使用这样的动态类

<button ng-class="buttonClass1">Button One</button>

可以在编辑时动态更改buttonClass1...

对于图片来源ng-src 也一样...

这里有一点DEMO 供你观察...

更新

这里是 ng-style 的更新 DEMO 和另一个好的 EXAMPLE 都包含 ng-class 和 ng-style

【讨论】：

我们不想在渲染 UI 时使用任何 CSS。所有类属性都应该动态呈现。如果我想为单个 HTML 元素应用多个属性怎么办
我没有课程，只有样式。可以通过ng-style动态应用吗？
感谢您的更新。我们使用了以下方法1。将所有需要的 css 内联到 html 中的样式标记中，创建所有内联的默认 css 类。 2.使用ng-class在组件上加载默认的内联css。 3. 从 angularjs 控制器中的数据库加载所有用户界面设置。 4. 使用 ng-style 将默认内联 css 类的属性值替换为项目特定 css 值。
@VinayakKedge 如果这是您的解决方案，请投票并接受它作为答案...