修改

Question

我有一个自定义my-textarea组件，其中包含以下模板：

<textarea>
  <ng-content></ng-content>
</textarea>

当我测试组件并尝试在其中注入一些文本时（就像我们使用普通的textarea html元素一样）：

<my-textarea>some text</my-textarea>

我得到一个没有预期注入字符串some text的空组件知道为什么会这样吗？我尝试用按钮做同样的事情，它的工作原理。（<button><ng-content></ng-content></button>）。
ng-content和textarea之间是否存在兼容性问题？感谢

Answer 1

您可以在component.ts

中使用@Input（）注释

例如：

@Input() someText: string;

现在，您可以在组件中“注入”所需的文本，如：

<my-textarea [someText]="'sometext'"></my-textarea>

或者当你在另一个组件的变量中有文本时

<my-textarea [someText]="someVariableWithText"></my-textarea>

修改

app.component.ts

@Component({
  selector: 'my-app',
  templateUrl: 'app/app.component.html',
})
export class AppComponent {
   text:string = "textToINsertINAnothercomponent";
}

app.component.html

<my-textarea [textInCustom]="text"></my-textarea>

MY-texarea.component.ts：

@Component({
    selector: "my-textarea",
    templateUrl: "app/my-textarea/my-textarea.component.html"
})
export class ReviewList {
    @Input() textInCustom: string;
}

MY-textarea.component.html：

<text-area>{{textInCustom}}</text-area>

ng-content和textarea兼容性问题

1 个答案:

修改