Javascript 如何使用自定义指令创建angularjs动态模板？

我想用angularjs创建一种使用自定义指令的模板，然后根据这些指令的属性创建输入字段，例如，如果模板中有此指令：

<cms:input type='text' size='14' default='this is a text' label='Content Header' ></cms:input>

<cms:input type='textarea' size='50' default='this is a text area' label='Content Paragraph' ></cms:input>

我想在主页中对模板做一个ngInclude，然后根据指令的属性显示字段，例如，对于上面的指令，它应该显示：带有默认文本的文本字段这是一个文本和带有文本“Content Header”的标签，以及带有相应属性的文本字段

因此，为了使事情变得基本，我将告诉你我想要什么，而不使用技术术语：因此，我想做的是创建不同的html页面，其中包含这些指令，将它们用作模板，例如“mainPage.html”、“header.html”，这些模板包含一个带有文本占位符的整个页面，占位符应该是这个指令

---

然后在另一个页面中，您应该指定要使用的模板，并根据模板中的占位符动态创建输入字段

，这样您似乎希望有任意数量的页面，这些页面看起来几乎相同，但每个标签、每个标题和帮助文本等的文本不同

为了解决这个问题，我们只需要一个常规视图（模板）和在不同的路由（范围）上保存不同数据的变量

您需要

角度布线

有一个教程似乎非常接近你想要做的。

var formApp=angular.module（'formApp'）[
"ngRoute",，
“FormAppController”
]);
formApp.config（['$routeProvider'，
函数（$routeProvider）{
$routeProvider。
当（“/第一个”{
templateUrl:'form.html'，
控制器：“firstCtrl”
}).
当（“/秒”{
templateUrl:'form.html'，
控制器：“secondCtrl”
})
.否则({
重定向到：'/first'
});
}]);
var formAppControllers=angular.module（'formAppControllers'，[]）；
formAppControllers.controller（'firstCtrl'，['$scope'，'$http'，
函数（$scope，$http）{
$scope.title='First title'；
$scope.firstLabel='First Label'；
}]);
formAppControllers.controller（'secondCtrl'，['$scope'，'$http'，
函数（$scope，$http）{
$scope.title='Second title'；
$scope.firstLabel='Second Label'；
}]);

{{title}}
{{firstLabel}}
模板和占位符有特定的含义，我认为您没有正确使用它们。在AngularJS中，模板是HTML文件，包含变量（绑定，如
{{labelText}}
）和一些逻辑，
ng switch
等。占位符是
标记上的一个属性。少一些技术术语，多一些关于输入和输出的信息会很有帮助。我不是说“模板”和“占位符”在angularjs中是什么意思，我是说一般性的，所以我会尝试更基本地解释我想要做什么html页面，它会像许多其他页面的模板一样，这是一个完整的html页面，包含所有标签、css类和其他内容，但它应该是某种“占位符”（angularjs的意思不是必需的，想想正常的意思）来代替文本，然后你在另一个页面中填充。另一个页面应该包含所有的“占位符”，但作为输入字段。希望能帮助大家看看这个问题
 app.directive('cmsInput', function() {
  return {
    restrict: 'E',
    require: '^ngModel',
    scope: {
        default: '@default',
        name: '@name',
        size: '@size',
        type: '@type'
    },

});