Question

由于“替换”配置一般不推荐使用，并且在1.5 angular.component中不可用，我想知道最佳实践是如何设置组件样式并保持高可用性。

示例：

app.component('changePasswordButton', {
   bindings: {
     users: '='
   },
   template: '<button class="btn btn-default"
               ng-disabled="vm.users.length == 0"
               ng-click="vm.changePassword()">Change password</button>',
   controllerAs: 'vm',
   controller: [function () {
      var vm = this;
      vm.changePassword = function () {
         //do it...
      });
   }]});

假设我想在使用它时设置按钮的样式，例如“btn-primary”。

我无法做到

 <change-password-button class="btn-primary"></change-password-button>

因为渲染的html将是：

<change-password-button class="btn-primary">
    <button ....>
</change-password-button>

关于如何以可扩展且漂亮的方式在组件（按钮）上应用上下文样式的任何想法？

Answer 1

我想出的唯一解决方案是添加绑定：

bindings: {
   applyClass: '@?'
},
template: '<button class="btn btn-default {{vm.applyClass}}"...

诀窍是否真的很美。

Angular 1.5组件按钮和样式

1 个答案: