AngularJS,从指令迁移到组件
AngularJS, migrate from directive to component
我正在尝试添加组件而不是指令,但它不起作用。
我的指令:
(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>
组件仅适用于元素名称,而指令默认适用于元素名称和属性名称。
<div ng-switch="nav.getTab()">
<display-tab ng-switch-when="details" tabname="details">details</display-tab>
</div>
我正在尝试添加组件而不是指令,但它不起作用。 我的指令:
(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>
组件仅适用于元素名称,而指令默认适用于元素名称和属性名称。
<div ng-switch="nav.getTab()">
<display-tab ng-switch-when="details" tabname="details">details</display-tab>
</div>