Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/25.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用模型绑定文本输入_Javascript_Angularjs - Fatal编程技术网

Javascript 使用模型绑定文本输入

Javascript 使用模型绑定文本输入,javascript,angularjs,Javascript,Angularjs,我使用一个非常简单的代码将用户文本输入绑定到模型。 文本框提示用户输入名称,并在enter键上显示hello“username”。 但我也希望Hello仅在用户输入名称时出现。 有人能帮我吗。默认情况下,当前Hello存在 用户界面页面 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head&

我使用一个非常简单的代码将用户文本输入绑定到模型。 文本框提示用户输入名称,并在enter键上显示hello“username”。 但我也希望Hello仅在用户输入名称时出现。 有人能帮我吗。默认情况下,当前Hello存在

用户界面页面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script type="text/javascript" src="../js/prac_controller.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>prac_one</title>
</head>
<body ng-app>

<div ng-controller="pracOne">
Enter the name<br>
<input type="text" ng-model="message.text"/>
<p>Hello, {{message.text}}</p>
</div>
</body>
</html>

谢谢你的回复;你能解释一下为什么使用&&和| |;有没有我可以参考的链接。message.text将显示用户键入的任何内容,然后&&do?@ShivangSarawagi将更新答案。看看这里:我可以使用jquery对angularJS进行DOM操作吗?就像使用jquery隐藏、显示方法代替三元运算符一样?当然可以。但是,如果有一种非常简单的方法,为什么要这样做呢?@ShivangSarawagi您可能喜欢使用Angular的
ngShow
ngHide
指令。
function pracOne($scope)
{
$scope.message={text:""};
}
<p>{{message.text ? 'Hello, ' + message.text : message.text}}</p>   
<p>{{message.text && 'Hello, '+message.text || message.text}}</p>
<p><span ng-show="message.text != ''">Hello, </span>{{message.text}}</p>