2013-11-25 65 views
0

我正在使用一個非常簡單的代碼將用戶文本輸入綁定到模型。 文本框提示用戶輸入名稱&在輸入時輸入hello「username」。 但我也希望你好,只有當用戶輸入名稱時纔會出現。 任何人都可以幫助我。目前默認爲Hello。角度Js綁定文本輸入與模型

UI頁面

<!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> 

控制器

function pracOne($scope) 
{ 
$scope.message={text:""}; 
} 

回答

1
<p>{{message.text ? 'Hello, ' + message.text : message.text}}</p> 

或者

<p>{{message.text && 'Hello, '+message.text || message.text}}</p> 

更新:您可以使用ngShow如果要有條件地顯示一個元素:

<p><span ng-show="message.text != ''">Hello, </span>{{message.text}}</p> 
+0

感謝您的回覆;你可以解釋爲什麼&&和||被使用;有沒有我可以參考的鏈接。 message.text將顯示任何用戶類型然後將&&做? – underdog

+0

@ShivangSarawagi我已經更新了答案。看看這裏:http://stackoverflow.com/questions/12008580/a-ternary-in-angular-templates-angularjs – AlwaysALearner

+0

我可以使用jQuery的DOM操作與angularJS?而不是三元運算符使用jQuery隱藏,顯示方法? – underdog