26
4
I have a buildable/publishable Angular library which I want to wrap ng-zorro button (and other components as well one-by-one) within to add my attribute selector instead of the ng-zorro selector and add more properties to the original component.
我有一个可构建/可发布的Angular库，我想将ng-zoro按钮（以及其他组件）一个接一个地封装在其中，以添加我的属性选择器，而不是ng-zorro选择器，并为原始组件添加更多属性。
In the source code of ng-zorro, you can see that the nz-button attribute is implemented like this:
在ng zorro的源代码中，您可以看到nz按钮属性是这样实现的：
个人中心
文章发布
退出
@Component({
selector: 'button[nz-button], a[nz-button]',
exportAs: 'nzButton',
preserveWhitespaces: false,
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
template: `
<span nz-icon nzType="loading" *ngIf="nzLoading"></span>
<ng-content></ng-content>
`,
host: {
class: 'ant-btn',
'[class.ant-btn-primary]': `nzType === 'primary'`,
'[class.ant-btn-dashed]': `nzType === 'dashed'`,
// ...
}
})
As you can see it is not a @Directive but a @Component that selects elements with the condition button[nz-button].
正如您所看到的，它不是一个@Directive，而是一个用条件按钮[nz按钮]选择元素的@Component。
Now this is the component I developed to wrap that component:
现在，这是我为包装该组件而开发的组件：
@Component({
selector: 'button, a',
preserveWhitespaces: false,
imports: [
NzButtonModule
],
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
template: `<ng-content></ng-content>`,
styleUrls: ['./button.component.scss'],
standalone: true,
host: {
'nz-button': '',
class: 'btn',
'[class.btn-primary]': `color === 'primary'`,
'[class.btn-secondary]': `color === 'secondary'`,
// ...
}
})
export class ButtonComponent {
@Input() size: ButtonSize = 'md';
@Input() shape: ButtonShape = 'default';
@Input() color: ButtonColor = 'primary';
@Input() fill: ButtonFill = 'solid';
@Input() expand: ButtonExpand = 'default';
}
What I am trying to achieve is that the button tag I place in the consumer components has all the ng-zorro attributes and mine too so I can implement new attributes to the native tag and override the ant styles in some cases.
我试图实现的是，我放置在使用者组件中的按钮标签具有所有的ng-zorro属性，我也具有这些属性，这样我就可以为原生标签实现新的属性，并在某些情况下覆盖ant样式。
In other words, I want to have [nzType] (from ng-zorro) and shape (from my ButtonComponent) both on a <button> tag.
换句话说，我想让[nzType]（来自ng-zarro）和shape（来自我的ButtonComponent）都在
Could you create a StackBlitz?
你能创建一个StackBlitz吗？
I ended up extending ng-zorro component to inherit its Inputs on my custom component it was not exactly what I wanted because now I have to use ng-zorro inputs by their name but not my desired name. For example, I have to use it like [nzSize] but not [size].
我最终扩展了ng-zorro组件，以继承其在我的自定义组件上的输入——这并不是我想要的，因为现在我必须使用ng-zorro-Inputs的名称，而不是我需要的名称。例如，我必须像[nzSize]那样使用它，但不能像[size]那样使用。
It is a workaround that will do the work but not a solid and complete solution.
这是一个可以完成工作的变通方法，但不是一个可靠而完整的解决方案。
I accept my solution until a better one comes.
我接受我的解决方案，直到更好的解决方案出现。
26
4
0
关于 this页面，我看到以下代码: if ((attributes & FileAttributes.Hidden) == FileAttributes.Hidden) 但我不明白为什么会变成这样。
函数pthread_mutex_init允许您指定指向属性的指针。但是我还没有找到关于pthread属性是什么的很好的解释。我一直只是提供NULL。这个论点有用吗？ 该文档，对于那些忘记它的人: PT
我们有一个 xml 节点“item”，其属性为“style”，即“Header1”。但是，这种风格可以改变。我们有一个名为 Header1 的属性集，它定义了它在 PDF 中的外观，通过 xsl:fo
我的任务是在用户点击它时从输入框中删除占位符并使标签可见。如果用户未在其中再次填写任何内容，请放回占位符并使标签不可见。 我可以隐藏它但不能重新分配它。我试过 element.setAttribute
我从文章中编写代码，并且有: public IActionResult Create([Bind(Include="Imie,Nazwisko,Stanowisko,Wiek")] Pracownik
你能给我解释一下以下属性吗？ 1) [MonoTouch.Foundation.Register("SomeClass")] 这个属性是否只用于向IB注册类？以编程方式扩展 iOS 类时是否必须使用此
我正在编写一个 C++ 程序，在调试时我在执行以下函数: int CClass::do_something() { ... // I've put a breakpoint here } 我的 C
我已经在 polymer 0.5 中构建了我的应用程序。 现在我已经将它更新到 polymer 1.0。 对于响应式布局，我使用了一个布局属性，它使用 Polymer 0.5 中布局属性的自定义逻辑。
我是使用 Jade 的新手——到目前为止它很棒。 但是我需要发生的一件事是具有“itemscope”属性的元素: 我的 Jade 符是: header(itemscope, itemtype='ht
我正在研究一个厨师实现，有时在过去的地方使用了 attribute.set，attribute.default 会这样做。为了解决这个问题，我对 Chef 属性优先范式非常熟悉。我知道“正常”属性(使
我经常看到html data-attribute (s) 将特定值/参数添加到 html 元素，例如使用它们将按钮“链接”到要打开的模式对话框等的 Bootstrap。 现在，我看到一个几乎著名的
假设如下: def create_new_salt self.salt = self.object_id.to_s + rand.to_s end 为什么使用“ self ”更好。而不是实例变量“
根据我的理解，Backbone.js 模型的属性应该通过以下方式声明为有点私有(private)的成员变量 this.set({ attributeName: attributeValue }) //
我有一个看起来像下面的XML文档: ... ... ... ...
我正在实现一个 JSF 组件，需要有条件地添加一些属性。这个问题类似于之前的 JSF: p:dataTable with f:attribute results in "argument type m
我正在尝试将应用程序发布到 Android 电子市场，但出现以下错误: W/ResourceType(16964): No known package when getting value for r
抱歉这么具体的应用程序，但我注意到另一篇关于 Maya 开发的回答很好的帖子。 我刚刚为 Maya 编写了一个插件节点。它只是根据湍流函数杀死一堆粒子。湍流由许多可在属性编辑器中调整的属性驱动。 在属
我在 html 元素中的数据属性为 Update .它具有数据属性的 bool 值。 跟下面的元素Update有什么区别吗？因为数据属性用双引号引起来。 html是否支持 bool 值？ 最佳答案 b
我正在尝试为企业库 5.0 的异常处理 block 创建自定义异常处理程序。据我了解，我需要使用属性开始上课“[ConfigurationElementType(typeof(CustomHandle
我找不到这两个选择器之间的区别。两者似乎都做同样的事情，即根据包含给定字符串的特定属性值选择标签。 对于 [attribute~=value] :http://www.w3schools.com/cs
我是一名优秀的程序员,十分优秀！