AngularJs

Question

我正在尝试为动态模板实施指令。根据下拉列表中的选择，模板应该改变。到目前为止，我只设法在页面加载时实现动态，但是当下拉列表中的值发生变化时，模板保持不变..`(function () { 'use strict';

// directive for loading incomeinformation, regular or military
angular.module('myModule').directive('dynamicTemplate', templateControl);

templateControl.$inject = [];

function templateControl() {
    var directive = {
        controller: mycontroller,
        controllerAs: 'mycontrollerCtrl',
        bindToController: true,
        restrict: 'E',
        template: '<ng-include src="mycontrollerCtrl.getTemplateUrl()"/>'
    };

    return directive;

    function mycontroller($attrs, $element, $scope, $compile) {
        var vm = this;
        vm.getTemplateUrl = getTemplateUrl;           
        function getTemplateUrl() {
            if ($attrs.templateId == 1)
                return "test1.html";
            if ($attrs.templateId == 3)
                return "test1.htm2";

            return "test3.html";
        }
    }
}

})();`

并且在 html 中：<dynamic-template templateid="{{model.TemplateId}}"></imp-dynamic-template>

Answer 1

in html: 属性名称必须是 "template-id" 因为你像 $attrs.templateId

一样访问它

AngularJs - 动态模板

AngularJs - Dynamic template

templates

dynamic

angularjs-directive