带有AngularJS的动态模板

我不知道该怎么表达，但还是这样。我想为具有特定类型产品偏好的用户创建一个“动态”商店。“动态”一词不是指web应用程序，而是指应用程序处理用户内容的方式。为了说明这一点，这里有一个例子

用户注册web应用程序以创建自己的在线商店。用户可以从不同的可用存储类型中选择起始存储类型。他/她选择“运动”作为他的/她的“模板”。然后页面根据我的设计加载这个“模板”。这一次，它将加载一个“体育”模板，其中包含仅与体育用品相关的项目字段、仅与体育用品相关的规格、为吸引体育用品买家而精心设计的网页设计

因此，这里的问题是根据用户喜欢的内容加载设计。不同用户的“动态”设计。比如当商店A的体育用品被其他用户访问时。用户将看到体育用品的设计。仅为吸引运动员/运动型男生而设计。同一用户访问了另一家商店B的时尚商品。用户会看到一个时装设计，里面有我想象不到的所有女孩子的东西

不同的“模板”包含不同的字段、部分或设计，具体取决于用户在注册时选择的“模板”类型。并且可以在用户配置面板/仪表板/设置面板中随意更改

问题是，我如何在angularjs中轻松实现它，并且可以扩展它以添加更多的“模板”

我想听听你们的意见^_^

PS：我将单词template/s放在引号中，因为我涉及到另一件事，而不是angularjs模板/模板引擎

---

事实上，在反复阅读你的文章几次之后，有很多不同的方法来“剥这只猫的皮”，你说的

ng show
把所有的东西都放在一页上。用于管理用户的身份。使用

ng show

隐藏/显示此特定用户应该看到的内容

每次都需要验证请求，因为讨厌的人可能会更改会话存储的值

路由
根据您的需要将用户路由到不同的模块

关于动态模板的原始答案/HTML

如果我理解正确，您希望有条件地加载HTML。我想您正在寻找一个指令。我实际上正在构建一个页面，将表示输入类型的XML值（即文本框、下拉列表等）从数据库转换为HTML。听起来是个类似的概念

以下是让我开始的原因：

我在很大程度上建立了它。这是我正在做的事情的一个简短部分

HTML:

}))

---

我希望这能让你开始并指出正确的方向

谢谢你抽出时间回答我的问题。我确实发现你的工作内容丰富，因此可以向我保证，我会在正确的轨道上工作。太好了。很高兴它有帮助！

  <div class="col-md-6" ng-repeat="item in ViewModel.caseFormData.pctrl">
        <caseformbuilder pctrl="item"></caseformbuilder>
    </div>

angular.module('yourModule').directive('caseformbuilder', function($compile) {
    var elementBuilder = (function(){
        function createTextbox(txtbox){
            return '<input id="" name="" type="text" class="" placeholder=""  />';
    }

    function createLabel(lbl){
        return '<p class="">' + lbl.text + '</p>';
    }

    function templateCreator(el){
        switch(el.type) {

            case 19:
                console.log('type is 19');
                return createLabel(el);
        }
    }

    return {
        createElement: function(jsonElement){
            return templateCreator(jsonElement);
        },
    };

})();

var linker = function(scope, element, attrs) {
    element.html(elementBuilder.createElement(scope.pctrl));
    $compile(element.contents())(scope);
}

return {
    restrict: "E",
    link: linker,
    scope: {
        pctrl:'='
    }
};