javascript - AngularJS，从指令迁移到组件

Question

我试图添加一个组件而不是指令，但它不起作用。我的指令:

    (function() {
    'use strict'; 
    angular.
        module('eventeditor')
        .directive("displayTab",
            function() {
                return({
                    templateUrl: function(elem, attr){
                        if(attr.tabname === 'details') return "/organizer/fragments/detailsform.html";
                    }
                });
            }
        );
    })();

组件样式:

(function() {
'use strict';

angular.
    module('eventeditor')
    .component("displayTab", {
        templateUrl: function($element, $attrs) {
            if ($attrs.tabname === 'details') return "/organizer/fragments/detailsform.html";
        }
    });

})();

我做错了什么？我使用我的模板，例如:

<div ng-switch="nav.getTab()">
    <div ng-switch-when="details" display-tab="" tabname="details">details</div>
</div>

Answer 1

组件仅适用于元素名称，而指令默认适用于元素名称和属性名称。

<div ng-switch="nav.getTab()">
    <display-tab ng-switch-when="details" tabname="details">details</display-tab>
</div>