Ionic 2 - 属性在类型错误上不存在
问题描述:
我正在开发Ionic 2中的一些东西,并且卡在一个简单的东西上。Ionic 2 - 属性在类型错误上不存在
我有一个文本框,我想在文本中输入文本,文本应该出现在哪里。我使用这个代码从this网站,并修改了一下。
它在一个简单的HTML/JS程序中工作。我认为这与我在我的离子项目中使用Typescript的事实有关。
HMTL:
<p>This is a <b id='TextToChange'>Test</b> </p>
<input type='text' id='userInput' value='Enter Text' />
<input type='button' (click)='changeText()' value='Change Text' />
JS/TS:
changeText() {
var userInput = document.getElementById('userInput').value;
document.getElementById('TextToChange').innerHTML = userInput;
}
然后我得到在Visual Studio中的错误(见下图)。然后,我改变了代码,以这样的:
var userInput = document.getElementById('userInput').nodeValue;
在VS我没有得到一个错误了,但如果我按下按钮的程序将不会抢值,以便让原始值消失,并保持空白。 这个没有错误日志。
有没有人有想法?
答
我来了一个解决方案。
HTML:
<p id='TextToChange'>{{value}}</p>
<input #box (keyup.enter)="changeText(box.value)">
<input type='button' (click)='changeText(box.value)' value='Change Text' />
注:添加您的出口类下面的下面! JS/TS:
value = '';
changeText(value: string) { this.value = value; }
您可以按回车键或者您也可以按下该按钮,显示文本。
答
用途:
var userInput = document.getElementById('userInput').innerText;
警告:我会强烈建议您阅读文档中关于Angular 2 Data binding。
在“绑定语法”一节中,您可以看到如何使用Angular 2完成这些操作的示例。这也适用于Ionic 2。您应该真的按照它显示的方式进行操作。
感谢您的回复,但我仍然得到相同的结果文本区域保持空白。 但是,当我按下userInput isnt null按钮时发生了改变。它看起来像这样:userInput =“” 我读了你给我的Angular 2数据绑定链接,也许我可以找到解决方案。 – CupOfTea