如何使用 angular 在 nativescript 中实现可见性

Question

我有一个非常简单的 nativescript angular 组件，我试图设置它的可见性和扩展 ContentView 似乎不起作用。

 <capture-component [visibility]="'collapse'" top="0" left="0"></capture-component>

 @Component({
  moduleId: module.id,
  templateUrl: './capture.component.html',
  selector: 'capture-component'
 })
 export class CaptureComponent extends ContentView {

 }

有人知道如何正确执行此操作吗？我已经尝试过折叠、'collapse'、折叠、绑定或未绑定等的变体。这做起来多么容易，真令人沮丧。我可以制作一个属性并设置 css 但如果可能我宁愿使用框架。

Answer 1

您必须在 CaptureComponent 中声明 Input() 可见性，然后在 capture.component.html 中使用它，例如

 <capture-component [visibility]="'collapse'" top="0" left="0"></capture-component>

假设您的 capture.component.html 以 GridLayout 开头，然后在您的 html

<GridLayout width="100%" height="100%" rows="auto,*" [visibility]="visibility">

并在您的 .ts 文件中

import { Input } from '@angular/core';
 @Component({
  moduleId: module.id,
  templateUrl: './capture.component.html',
  selector: 'capture-component'
 })
 export class CaptureComponent extends ContentView {
 @Input() visibility: string;
 }

Answer 2

我最终只使用了 *ngIf，尽管我觉得在扩展任何基本视图时可见性应该起作用。

如何使用 angular 在 nativescript 中实现可见性

How to implement visibility in nativescript with angular

components

visibility

nativescript

angular